Skip to content

Commit

Permalink
feat: Model window ( including dialogue ) open and right side scroll …
Browse files Browse the repository at this point in the history 
…bar of browser disappears #864
  • Loading branch information
@rstoenescu
rstoenescu committed Sep 9, 2017
1 parent b89b060 commit 035be32
Showing 1 changed file with 9 additions and 3 deletions.
12 changes: 9 additions & 3 deletions src/components/modal/QModal.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@ import Platform from '../../features/platform'
import EscapeKey from '../../features/escape-key'
import extend from '../../utils/extend'
import { QTransition } from '../transition'
import { getScrollbarWidth } from '../../utils/scroll'
const positions = {
top: 'items-start justify-center with-backdrop',
Expand Down Expand Up @@ -156,8 +157,12 @@ export default {
return
}
document.body.appendChild(this.$el)
document.body.classList.add('with-modal')
const body = document.body
body.appendChild(this.$el)
body.classList.add('with-modal')
this.bodyPadding = window.getComputedStyle(body).paddingRight
body.style.paddingRight = `${getScrollbarWidth()}px`

This comment has been minimized.

Sign in to view

Copy link
@alexandesigner

alexandesigner Oct 16, 2017

Contributor

@rstoenescu I agree that hiding the bar to avoid the scroll is interesting, however this paddingRight is not an interesting behavior .. in this case I suggest you just remove this functionality

captura de tela 2017-10-16 as 17 47 12

This 15px space remains underneath the overlay, maybe aesthetically it does not look cool

This comment has been minimized.

Sign in to view

Copy link
@rstoenescu

rstoenescu Oct 20, 2017

Author Member

We have to choose. Is this new behavior better or is the "flickering" when opening/closing better? I think the new behavior... We can't have both. I'm open if someone can find a solution for both situations.

This comment has been minimized.

Sign in to view

Copy link
@alexandesigner

alexandesigner Oct 21, 2017

Contributor

Allright, I will study an alternative that involves both solutions.

This comment has been minimized.

Sign in to view

Copy link
@rstoenescu

rstoenescu Oct 21, 2017

Author Member

Thanks! Looking forward for it!
EscapeKey.register(() => {
if (this.noEscDismiss) {
return
Expand Down Expand Up @@ -186,7 +191,8 @@ export default {
setTimeout(() => {
if (!openedModalNumber) {
document.body.classList.remove('with-modal')
body.classList.remove('with-modal')
body.style.paddingRight = this.bodyPadding
}
if (typeof this.__onClose === 'function') {
this.__onClose()
Expand Down

0 comments on commit 035be32

Please sign in to comment.