Vuetify: [Feature Request] Ability to limit Vuetify `<v-app>` to parent `<div>` size

[ThaDaVos]

Problem to solve

Have vuetify only take-up a part of the web-page instead of the whole web-page.
Currently trying to include an App I made in a Magento webpage, everything stays within the page except the drawers, footer and navbar, they size to fullscreen.

Proposed solution

An extra attribute for the <v-app> which allows it to be limited to it's parents element width and height

[M6stafa]

i think you must set absolute prop instead of fixed and for its parent set position: relative.
absolute elements stick to the first parent with position: relative.

[ThaDaVos]

It sort of works except that the drawers are still shown when hiden :P

[qm3ster]

Can you provide an example link or a Playground.vue?

[ThaDaVos]

I can try but it's an app I made and I'm trying to include in a magento webshop :P

[M6stafa]

We just need the part that drawer is inside a div, to test somthing on it.

[ThaDaVos]

I put the whole <v-app> in a div - I can try to clue something together for you guys

[ThaDaVos]

What's the URL for the Vuetify CodePen thing?

[M6stafa]

https://codepen.io/johnjleider/pen/bgJOrX

[ThaDaVos]

Done it:
https://codepen.io/anon/pen/JBMYZo?editors=1010

I had to increase the z-index of the toolbar because the drawers went overtop it on the CodePen but not in my app

[qm3ster]

{
  overflow: hidden;
}

seems to be enough.
Either on #root or #app even.

[ThaDaVos]

Lolz - that fixed it :P

[ThaDaVos]

Not completely fixed - see screenshot:
The dropdowns are offcenter

[ThaDaVos]

Still having issues...
After doing what was suggested in this github thread I'm still having issues with my VueJS app not sizing to it's parent div.
Also having issue with dropdown from comboboxes not being on the right spot
CodePen: https://codepen.io/anon/pen/JBMYZo?editors=1000
Dev environment: http://dev.schotmanelektro.eu/wizard#/(gewijzigd)

[ThaDaVos]

Fixed the sizing issue:
Why is application-wrap setting a min-height using the vh units, to 100vh 🤪
I just override it now

Still have to fix the dropdown issue

[ThaDaVos]

Dropdown issue is fixed by using :attach="true"

[johnleider]

It appears that this has been solved or at the very least moved into the help category.

If you have any additional questions, please direct them to the official Discord server.