1

I have a VuetifyJS (v3) page with a v-app-bar and v-navigation-drawer both present, and both with the app prop set. The v-app-bar takes up all the horizontal space extending from the top left corner. The v-navigation-drawer starts from underneath the v-app-bar. How do reverse this relationship? I.e. make the v-navigation-drawer take up all vertical space starting from the top left corner and have the v-app-bar start from the side of the v-navigation-drawer? The vuetifyjs.com docs pages actually do this (see below). So my Q is how do I do what vuetifyjs.com is doing here?

enter image description here

enter image description here

spinkus
  • 7,694
  • 4
  • 38
  • 62

1 Answers1

2

Documentation for this is here: https://next.vuetifyjs.com/en/features/application-layout/

The way layout components arrange themselves is controlled by the order they appear in the template, and can be adjusted with the order prop which behaves like order in CSS.

Kael Watts-Deuchar
  • 4,213
  • 1
  • 26
  • 50