github-mirror/framework
github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2025-04-24 21:54:04 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Move post previews outside of .Post-body so they don't get clipped

Browse Source
This commit is contained in:
Toby Zerner 2015-09-16 14:43:48 +09:30
parent 390feae647
commit 7ab1eb4f64
2 changed files with 8 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
extensions/mentions/js/forum/src/addPostMentionPreviews.js
View File

@ -12,6 +12,7 @@ export default function addPostMentionPreviews() {
this.oldPostContentHtml = contentHtml;
const parentPost = this.props.post;
const $parentPost = this.$();
this.$('.UserMention, .PostMention').each(function() {
m.route.call(this, this, false, {}, {attrs: {href: this.getAttribute('href')}});
@ -25,8 +26,7 @@ export default function addPostMentionPreviews() {
// Wrap the mention link in a wrapper element so that we can insert a
// preview popup as its sibling and relatively position it.
const $preview = $('<ul class="Dropdown-menu PostMention-preview fade"/>');
const $wrapper = $('<span class="PostMention-wrapper"/>');
$this.wrap($wrapper).after($preview);
$parentPost.append($preview);
const getPostElement = () => {
return $(`.PostStream-item[data-id="${id}"]`);
@ -53,7 +53,10 @@ export default function addPostMentionPreviews() {
// Position the preview so that it appears above the mention.
// (The offsetParent should be .Post-body.)
const positionPreview = () => {
$preview.show().css('top', $this.offset().top - $this.offsetParent().offset().top - $preview.outerHeight(true));
$preview.show()
.css('top', $this.offset().top - $parentPost.offset().top - $preview.outerHeight(true))
.css('left', $this.offsetParent().offset().left - $parentPost.offset().left)
.css('max-width', $this.offsetParent().width());
};
const showPost = post => {
@ -90,7 +93,7 @@ export default function addPostMentionPreviews() {
$this.on('touchstart', e => e.preventDefault());
$this.parent().hover(
$this.add($preview).hover(
() => {
clearTimeout(timeout);
timeout = setTimeout(showPreview, 250);

1
extensions/mentions/less/forum/extension.less
View File

@ -84,4 +84,5 @@
.PostMention-preview-discussion {
padding-top: 0 !important;
font-weight: bold !important;
white-space: normal !important;
}