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

Refactor #882

pull/4503/head
mertsincan 2023-09-25 11:05:27 +01:00
parent e204de32f4
commit 5e53cef422
11 changed files with 38 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
assets/styles/layout/_news.scss
View File

@ -4,11 +4,16 @@
left: 0;
z-index: 1100;
width: 100%;
height: 2rem;
padding: 0 2rem;
.layout-news-container {
display: flex;
justify-content: space-between;
align-items: center;
height: 2rem;
padding: 0 2rem;
width: calc(100% - var(--scrollbar-width, 0px));
height: 100%;
}
.layout-news-content {
flex: 1;

1
assets/styles/layout/_responsive.scss
View File

@ -101,6 +101,7 @@
.blocked-scroll {
overflow: hidden;
padding-right: var(--scrollbar-width);
}
}

3
assets/styles/layout/_topbar.scss
View File

@ -9,11 +9,12 @@
transition: background-color 1s;
.layout-topbar-inner {
height: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 4rem;
height: 100%;
width: calc(100% - var(--scrollbar-width, 0px));
}
&.layout-topbar-sticky {

2
components/lib/blockui/BlockUI.vue
View File

@ -51,6 +51,7 @@ export default {
document.body.appendChild(this.mask);
DomHandler.addClass(document.body, 'p-overflow-hidden');
document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px');
document.activeElement.blur();
} else {
this.mask = DomHandler.createElement('div', {
@ -92,6 +93,7 @@ export default {
if (this.fullScreen) {
document.body.removeChild(this.mask);
DomHandler.removeClass(document.body, 'p-overflow-hidden');
document.body.style.removeProperty('--scrollbar-width');
} else {
this.$refs.container.removeChild(this.mask);
}

2
components/lib/calendar/Calendar.vue
View File

@ -1649,6 +1649,7 @@ export default {
document.body.appendChild(this.mask);
DomHandler.addClass(document.body, 'p-overflow-hidden');
document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px');
}
},
disableModality() {
@ -1683,6 +1684,7 @@ export default {
if (!hasBlockerMasks) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
document.body.style.removeProperty('--scrollbar-width');
}
},
updateCurrentMetaData() {

2
components/lib/dialog/Dialog.vue
View File

@ -205,8 +205,10 @@ export default {
if (!this.modal) {
if (this.maximized) {
DomHandler.addClass(document.body, 'p-overflow-hidden');
document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px');
} else {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
document.body.style.removeProperty('--scrollbar-width');
}
}
},

3
components/lib/galleria/Galleria.vue
View File

@ -36,6 +36,7 @@ export default {
beforeUnmount() {
if (this.fullScreen) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
document.body.style.removeProperty('--scrollbar-width');
}
this.mask = null;
@ -52,6 +53,7 @@ export default {
onEnter(el) {
this.mask.style.zIndex = String(parseInt(el.style.zIndex, 10) - 1);
DomHandler.addClass(document.body, 'p-overflow-hidden');
document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px');
this.focus();
},
onBeforeLeave() {
@ -61,6 +63,7 @@ export default {
ZIndexUtils.clear(el);
this.containerVisible = false;
DomHandler.removeClass(document.body, 'p-overflow-hidden');
document.body.style.removeProperty('--scrollbar-width');
},
onActiveItemChange(index) {
if (this.activeIndex !== index) {

3
components/lib/image/Image.vue
View File

@ -94,6 +94,7 @@ export default {
onImageClick() {
if (this.preview) {
DomHandler.addClass(document.body, 'p-overflow-hidden');
document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px');
this.maskVisible = true;
setTimeout(() => {
this.previewVisible = true;
@ -164,6 +165,7 @@ export default {
},
onLeave() {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
document.body.style.removeProperty('--scrollbar-width');
this.$emit('hide');
},
onAfterLeave(el) {
@ -182,6 +184,7 @@ export default {
this.rotate = 0;
this.scale = 1;
DomHandler.removeClass(document.body, 'p-overflow-hidden');
document.body.style.removeProperty('--scrollbar-width');
}
},
computed: {

2
components/lib/sidebar/Sidebar.vue
View File

@ -125,6 +125,7 @@ export default {
if (this.blockScroll) {
DomHandler.addClass(document.body, 'p-overflow-hidden');
document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px');
}
},
disableDocumentSettings() {
@ -132,6 +133,7 @@ export default {
if (this.blockScroll) {
DomHandler.removeClass(document.body, 'p-overflow-hidden');
document.body.style.removeProperty('--scrollbar-width');
}
},
onKeydown(event) {

2
layouts/AppNews.vue
View File

@ -1,5 +1,6 @@
<template>
<div class="layout-news" :style="$appState.announcement.backgroundStyle">
<div class="layout-news-container">
<i></i>
<div class="layout-news-content">
<span class="layout-news-text" :style="$appState.announcement.textStyle">{{ $appState.announcement.content }}</span>
@ -9,6 +10,7 @@
<span class="pi pi-times"></span>
</a>
</div>
</div>
</template>
<script>

4
layouts/default.vue
View File

@ -43,6 +43,7 @@ export default {
this.sidebarActive = false;
DomHandler.removeClass(document.body, 'blocked-scroll');
document.body.style.removeProperty('--scrollbar-width');
this.$toast.removeAllGroups();
}
}
@ -61,14 +62,17 @@ export default {
if (this.sidebarActive) {
this.sidebarActive = false;
DomHandler.removeClass(document.body, 'blocked-scroll');
document.body.style.removeProperty('--scrollbar-width');
} else {
this.sidebarActive = true;
DomHandler.addClass(document.body, 'blocked-scroll');
document.body.style.setProperty('--scrollbar-width', DomHandler.calculateScrollbarWidth() + 'px');
}
},
onMaskClick() {
this.sidebarActive = false;
DomHandler.removeClass(document.body, 'blocked-scroll');
document.body.style.removeProperty('--scrollbar-width');
},
hideNews(event) {
this.$appState.newsActive = false;