Fixed #882 - Dialog component scrollbar shift

pull/4503/head
mertsincan 2023-09-25 10:30:34 +01:00
parent e0fe133189
commit e204de32f4
2 changed files with 3 additions and 0 deletions

View File

@ -19,6 +19,7 @@ const styles = `
.p-overflow-hidden { .p-overflow-hidden {
overflow: hidden; overflow: hidden;
padding-right: var(--scrollbar-width);
} }
`; `;

View File

@ -213,11 +213,13 @@ export default {
enableDocumentSettings() { enableDocumentSettings() {
if (this.modal || (!this.modal && this.blockScroll) || (this.maximizable && this.maximized)) { if (this.modal || (!this.modal && this.blockScroll) || (this.maximizable && this.maximized)) {
DomHandler.addClass(document.body, 'p-overflow-hidden'); DomHandler.addClass(document.body, 'p-overflow-hidden');
document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px');
} }
}, },
unbindDocumentState() { unbindDocumentState() {
if (this.modal || (!this.modal && this.blockScroll) || (this.maximizable && this.maximized)) { if (this.modal || (!this.modal && this.blockScroll) || (this.maximizable && this.maximized)) {
DomHandler.removeClass(document.body, 'p-overflow-hidden'); DomHandler.removeClass(document.body, 'p-overflow-hidden');
document.body.style.removeProperty('--scrollbar-width');
} }
}, },
onKeyDown(event) { onKeyDown(event) {