vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Fixed #490 - OverlayPanel :before "indicator" needs dynamic placement

pull/682/head
mertsincan 2020-11-26 08:55:22 +03:00
parent c013d5e9cf
commit b17a65d98b
1 changed files with 11 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/overlaypanel/OverlayPanel.vue
View File

@ -103,7 +103,16 @@ export default {
alignOverlay() { alignOverlay() {
DomHandler.absolutePosition(this.container, this.target); DomHandler.absolutePosition(this.container, this.target);
if (DomHandler.getOffset(this.container).top < DomHandler.getOffset(this.target).top) { const containerOffset = DomHandler.getOffset(this.container);
const targetOffset = DomHandler.getOffset(this.target);
let arrowLeft = 0;
if (containerOffset.left < targetOffset.left) {
arrowLeft = targetOffset.left - containerOffset.left;
}
this.container.style.setProperty('--overlayArrowLeft', `${arrowLeft}px`);
if (containerOffset.top < targetOffset.top) {
DomHandler.addClass(this.container, 'p-overlaypanel-flipped'); DomHandler.addClass(this.container, 'p-overlaypanel-flipped');
} }
}, },
@ -223,7 +232,7 @@ export default {
.p-overlaypanel:after, .p-overlaypanel:before { .p-overlaypanel:after, .p-overlaypanel:before {
bottom: 100%; bottom: 100%;
left: 1.25rem; left: calc(var(--overlayArrowLeft, 0) + 1.25rem);
content: " "; content: " ";
height: 0; height: 0;
width: 0; width: 0;