oss/FrankerFaceZ
oss/FrankerFaceZ
1
0
Fork 0
mirror of https://github.com/FrankerFaceZ/FrankerFaceZ.git synced 2025-08-04 11:44:00 +00:00
Code Wiki Activity

Fix balloon popups for metadata.

Browse source
This commit is contained in:
SirStendec 2017-12-13 20:45:22 -05:00
parent ac6663053f
commit ac35ee5fab
2 changed files with 33 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

19
src/modules/metadata.js
View file

@ -349,16 +349,25 @@ export default class Metadata extends Module {
el._ffz_destroy = el._ffz_outside = null;
};
const tt = el._ffz_popup = new Tooltip(document.body.querySelector('.twilight-root') || document.body, el, {
const parent = document.body.querySelector('.twilight-root') || document.body,
tt = el._ffz_popup = new Tooltip(parent, el, {
manual: true,
html: true,
tooltipClass: 'ffz-metadata-balloon tw-balloon block',
arrowClass: 'tw-balloon__tail',
tooltipClass: 'ffz-metadata-balloon tw-balloon tw-block tw-border tw-elevation-1 tw-border-radius-small tw-c-background',
arrowClass: 'tw-balloon__tail tw-absolute',
innerClass: 'tw-pd-1',
popper: {
placement: 'top-end'
placement: 'top-end',
modifiers: {
preventOverflow: {
boundariesElement: parent
},
flip: {
behavior: ['top', 'bottom', 'left', 'right']
}
}
},
content: (t, tip) => def.popup.call(this, el._ffz_data, tip, () => refresh_fn(key)),
onShow: (t, tip) =>
@ -366,7 +375,7 @@ export default class Metadata extends Module {
el._ffz_outside = new ClickOutside(tip.outer, destroy);
}),
onHide: destroy
})
});
tt._enter(el);
});

16
styles/tooltips.scss
View file

@ -32,8 +32,8 @@ body {
}
}
&[x-placement^="left"] > .tw-balloon__tail {
right: -3px;
&[x-placement^="right"] > .tw-balloon__tail {
left: -3px;
box-shadow: -1px 1px 0 #dad8de;
.tw-theme--dark & {
@ -45,8 +45,8 @@ body {
}
}
&[x-placement^="right"] > .tw-balloon__tail {
left: -3px;
&[x-placement^="left"] > .tw-balloon__tail {
right: -3px;
box-shadow: 1px -1px 0 #dad8de;
.tw-theme--dark & {
@ -108,16 +108,16 @@ body {
}
}
&[x-placement^="left"] {
&[x-placement^="right"] {
.ffz__tooltip--arrow {
right: -3px;
left: -3px;
border-radius: 0 2px 0 0;
}
}
&[x-placement^="right"] {
&[x-placement^="left"] {
.ffz__tooltip--arrow {
left: -3px;
right: -3px;
border-radius: 0 0 0 2px;
}
}