experimental disjointed popups

This commit is contained in:
Henry Jameson 2022-05-20 00:56:23 +03:00
commit fd831a27f4
4 changed files with 26 additions and 14 deletions

View file

@ -43,6 +43,7 @@ const Popover = {
methods: {
containerBoundingClientRect () {
const container = this.boundToSelector ? this.$el.closest(this.boundToSelector) : this.$el.offsetParent
console.log(container)
return container.getBoundingClientRect()
},
updateStyles () {
@ -125,10 +126,17 @@ const Popover = {
// Note, separate translateX and translateY avoids blurry text on chromium,
// single translate or translate3d resulted in blurry text.
console.log(translateX + screenBox.x + screenBox.width)
console.log(Math.round(parentBounds.width))
this.styles = {
opacity: 1,
transform: `translateX(${Math.round(translateX)}px) translateY(${Math.round(translateY)}px)`
// transform: `translateX(${Math.round(translateX)}px) translateY(${Math.round(translateY)}px)`
left: `${Math.round(translateX + screenBox.x + screenBox.width / 2)}px`,
top: `${Math.round(translateY + screenBox.y + screenBox.height / 2)}px`,
maxWidth: `${Math.round(parentBounds.width)}px`,
position: 'fixed'
}
console.log(this.styles)
},
showPopover () {
const wasHidden = this.hidden