Vuetify: [Bug Report] Inset footer is causing some rendering issues with navigation drawer

[BruceBradford]

Versions and Environment

Vuetify: 1.1.8
Last working version: 1.1.6
Vue: 2.5.16
Browsers: Chrome 67.0.3396.99
OS: Windows 7

Steps to reproduce

1. Build a navigation drawer (mini set to true in my case)
2. Add page content. The page content should be large enough to cause vertical scrolling
3. Scroll the page up and down and observe the rendering of the navigation drawer

Expected Behavior

Navigation should not cease to render

Actual Behavior

1. Navigation drawer ceases to render.
2. It appears as if the navigation drawer is translucent and you can see the footer behind the drawer.

Reproduction Link

https://codepen.io/anon/pen/zLdZBE

[scp-nm]

Hi,
I'm getting the same, and this is easily reproducible on the Layout Sandbox - simply change footer to 'inset':
https://vuetifyjs.com/en/examples/layouts/sandbox

[steinwachs]

I can confirm both the issue and the last working version (1.1.6). The issue is present both in 1.1.9 and 1.2.0-beta.0 as well.

The issue seems to be that the navigation drawer max-height is now calculated differently (see screenshot).

[KaelWD]

This was caused by cc4959f0f68487d9359d8bec48f14e36a42e7cf2 and 517e64aba7b60391fc9e255a3b8eba49876a3436, we need a better system to fix all these issues.

[colegasgroupdev]

Does anyone have a work around for this?

[steinwachs]

One workaround option - if you do not need the drawer to be permanent - is to use the temporary prop for the moment:

~~
app
temporary
...
~~

Alternatively, just use the style prop to override the incorrectly calculated max-height:

~~
app
style="max-height: 100%"
...
~~

[KaelWD]

Duplicate of #4686

[EstefanTT]

There is a fun work around ...

You store in VueX store the value True/False of the drawer and change its state when you open and close it.
Then, you define a margin for the content of the Footer only displayed when the value of the Drawer is "true".