1

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 mini-variant property then the content gets resized (the layer moves the start of the content).

Now I found out – by complete accident – that I (kind of) get the behaviour I want by setting the width property (of v-navigation-drawer) not to a number (like 224 or "224") but to a string containing the number plus a unit (like "224px"). To me this actually seems to be a bug. Is it? If so: is there a proper way to achieve the same result?

Pawel Kam
  • 1,684
  • 3
  • 14
  • 30
svenho
  • 11
  • 1
  • Hi, welcome to SO. Your question would benefit if you helped others to reproduce the problem by including an exemplary code. See https://stackoverflow.com/help/minimal-reproducible-example – Pawel Kam Jun 30 '22 at 11:45
  • You may want to play with the `temporary`, `app` and `clipped` props - in various combinations until you achieve what you want. – IVO GELOV Jun 30 '22 at 13:53
  • Thanks @IVOGELOV, unfortunately that did not work for me. I ended up with setting the padding-left of the v-main component to a fixed value for medium devices. – svenho Jul 04 '22 at 16:39

0 Answers0