Questions tagged [v-navigation-drawer]
22 questions
2
votes
3 answers
How to remove border next to v-navigation-drawer
I made a navigation drawer WITHOUT borders but a thin line on the left just can't seem to go away.
I tried doing a border : none to remove any border around the component, it won't work.
I also tried inspecting the element, and the problem is a
Quentin
- 65
- 9
2
votes
2 answers
Vuetify v-navigation-drawer cannot overflow button
I have a v-navigation-drawer and it's design must include a toggle expand button that overflows the drawer itself like so:
But for some unknown reason, I can't remove the overflow hidden property.
I tried to remove it like this:
…
Augustin Riedinger
- 20,909
- 29
- 133
- 206
2
votes
0 answers
Vuetify 3 v-navigation-drawer not closing when clicked outside
I'm trying to close navigation drawer after it's been opened by clicking outside, but that doesn't work for some reason. If I click outside v-navigation-drawer nothing happens - no errors, no warns, just nothing
My dependencies in…
artak-avanesian
- 83
- 4
2
votes
1 answer
Toggle v-navigation-drawer's expand-on-hover not resizing content
I want to implement a "pin" functionality for my v-navigation-drawer i.e. switching between the mini-variant and normal version on button press but preserving the expand-on-hover functionality.
I tried it like this:
ToasteR
- 886
- 7
- 20
2
votes
0 answers
How can I do a navigation-drawer with frosted glass effect in vuetify?
I would like to achieve the effect of the deepin operating system control bar. I have dealt with some css codes that I have found online but none works for me on the drawer, if it works on v-cards but not on navigation-drawer.
this is example…
Yuniel Acosta
- 31
- 1
- 10
2
votes
2 answers
Vuetify navigation drawer closing only after item is clicked twice
I'm very new to Vue so I'm not sure how to check this, but
my vue v-navigation-drawer is below, it's located in app-root.vue. It was working at first, closing when you click on a drawer item, but now you have to click twice in order for it to close.…
chuckd
- 13,460
- 29
- 152
- 331
1
vote
0 answers
Vuetify navigation-drawer triggering window resize event even after applying disable-resize-watcher
Vuetify navigation-drawer open/close action is triggering window.onresize event which is causing problems for this flow I am trying,
I am trying to auto-close the navigation-drawer when the browser is resized and its width goes less than 1000px,…
zohojayesh
- 46
- 6
1
vote
0 answers
Vuetify – Expand v-navigation-drawer on click like it works on hover
The v-navigation-drawer has a very nice expand-on-hover functionality; here the expanded layer is displayed atop of the content; i.e. the content is not resized. Now I would like to have the same behaviour on click; but if I just manipulate the…
svenho
- 11
- 1
1
vote
1 answer
How to prevent v-main to shift when v-navigation-drawer is opened ? (Vuetify, Vue.js 2, Nuxt, Typescript)
I'm building an app with a v-app component at the root, using a v-navigation-drawer and I'd like to add a "Chat" page, where I'd also like to use v-navigation-drawer.
Problem is components don't display correctly. When I open the v-navigation-drawer…
CosmicDarine
- 98
- 9
1
vote
1 answer
How do I center vertically a v-list in v-navigation-drawer mini-variant in vuetify?
I have a navigation drawer with mini-variant and expand-on-hover-option
I want to center my v-list vertically in the drawer
This is my code :
fakhfakh emna
- 73
- 2
- 8
0
votes
0 answers
Navigationdrawer lags update with InertiaJS and Vuetify on Persistent layout
I have a setup with InertiaJS and Vuetify, and i can't get my navigationdrawer to work properly. I have the navdrawer in a layout which is persistent. Now, if i select a navigation link, the link won't update until i leave or enter the bar after the…
0
votes
1 answer
Change v-navigation-drawer content on click
I have 1 v-navigation-drawer and 2 buttons.
The first button opens the 1st drawer, the 2nd button is supposed to change the drawer's content.
What I would like is to be able to change the content of the drawer (once opened), as soon as I click on…
Quentin
- 65
- 9
0
votes
1 answer
Vuetify 3 bottom v-navigation-drawer with tabs and scrollable content not closing on swipe down
I am using Vuetify 3 to create a bottom sheet for mobile using v-navigation-drawer with location="bottom" prop.
Everything works fine up to this point with swipe-down to close the bottom sheet. When I add touchstart, touchmove, touchend event…
bruce
- 73
- 5
0
votes
1 answer
How to add a gradient to an image in a v-navigation-drawer in Vuetify 3, Vue 3?
I am using v-navigation-drawer in my Vue 3 app with Vuetify 3:
...