vuetify
vuetify copied to clipboard
[Bug Report][3.5.11] Content behind v-navigation-drawer scrolls
Environment
Vuetify Version: 3.5.11 Vue Version: 3.4.21 Browsers: Chrome 122.0.0.0 OS: Mac OS 10.15.7
Steps to reproduce
Open the drawer and scroll
Expected Behavior
The content behind the drawer should not scroll, especially if the options temporary or scrim are used, because they add an overlay.
Actual Behavior
The content behind the drawer scrolls.
Reproduction Link
Or if the drawer also has scroll: reproduction link.
I'm living with this bug for way too long, so I'm very happy to see progress.
Today I also noticed that not only the content behind the nav drawer scrolls, but the scrim scrolls with it. So scrolling up while the nav drawer is open moves away the scrim.
This might be related to the fact that I decided to not use v-main
because it's magic causes too many issues for me. Unfortunately there's no documentation whatsoever about what v-main
is actually doing (API docs, Component docs), so I can't determine if using it has more upsides than it causes trouble.
This might be one of the troubles of not using it but I did not investigate further as I found a temporary fix, so it could be an entirely different issue as well. I'm just leaving this here as it might be related to this issue.
My temporary fix is putting this into App.vue
:
:deep(.v-navigation-drawer__scrim) {
position: fixed;
}