#237 for sidebar

pull/256/head
cagataycivici 2020-03-17 12:58:36 +03:00
parent 382a51c036
commit 2f020a1fcc
2 changed files with 24 additions and 5 deletions

View File

@ -3248,6 +3248,9 @@ body .p-sidebar .p-sidebar-close {
body .p-sidebar .p-sidebar-close:hover {
color: #333333;
}
body .p-sidebar-mask {
transition-duration: 0.2s;
}
body .p-tooltip .p-tooltip-text {
background-color: #333333;
color: #ffffff;

View File

@ -83,21 +83,28 @@ export default {
enableModality() {
if (!this.mask) {
this.mask = document.createElement('div');
this.mask.setAttribute('class', 'p-sidebar-mask');
this.mask.style.zIndex = String(parseInt(this.$refs.container.style.zIndex, 10) - 1);
DomHandler.addMultipleClasses(this.mask, 'p-component-overlay');
if (this.dismissable) {
this.bindMaskClickListener();
}
document.body.appendChild(this.mask);
DomHandler.addClass(document.body, 'p-overflow-hidden');
setTimeout(() => {
DomHandler.addClass(this.mask, 'p-component-overlay');
}, 1);
}
},
disableModality() {
if (this.mask) {
DomHandler.addClass(this.mask, 'p-sidebar-mask-leave');
this.mask.addEventListener('transitionend', () => {
this.unbindMaskClickListener();
document.body.removeChild(this.mask);
DomHandler.removeClass(document.body, 'p-overflow-hidden');
this.mask = null;
});
}
},
bindMaskClickListener() {
@ -136,6 +143,15 @@ export default {
transition: transform .3s;
}
.p-sidebar-mask {
background-color: transparent;
transition: background-color;
}
.p-sidebar-mask-leave.p-component-overlay {
background-color: transparent;
}
.p-sidebar-left {
top: 0;
left: 0;