Vuetify col sizing with display helpers
// Vuetify - sizing columns with display helpers.
// col-12 is the standard for taking up the full width of the row.
<v-row>
<v-col class="col-12"></v-col>
</v-row>
// col-md-6 means when the viewport is larger than the md breakpoint, the column will take up half (6 cols) of space.
// When the viewport is below md breakpoint, it will revert to col-12.
<v-row>
<v-col class="col-12 col-md-6"></v-col>
</v-row>