no-legacy-grid.md

Pattern: Use of legacy grid

Issue: -

Description

Helps migrate from v-layout/v-flex to v-row/v-col and prevents accidental use of old grid props on the new grid components. It will not prevent the use of extra attributes on the new grid components, see grid-unknown-attributes

Examples of incorrect code for this rule:

<v-layout row wrap justify-center>
  <v-flex xs12 md6 sm4 lg2></v-flex>
</v-layout>

<v-col xs12></v-col>

<v-container grid-list-md></v-container>

<v-layout column></v-layout>

Examples of correct code for this rule:

<v-row justify="center">
  <v-col cols="12" md="6" sm="4" lg="2"></v-flex>
</v-layout>

<v-col cols="12"></v-col>

Further Reading

• eslint-plugin-vuetify - no-legacy-grid