List

The v-list component is used to display information. It can contain an avatar, content, actions, subheaders and much more. Lists present content in a way that makes it easy to identify a specific item in a collection. They provide a consistent styling for organizing groups of text and images.

<v-layout row wrap>
  <v-list-item>
    <v-list-item-content>
      <v-list-item-title>Single-line item</v-list-item-title>
    </v-list-item-content>
  </v-list-item>
  
  <v-list-item two-line>
    <v-list-item-content>
      <v-list-item-title>Two-line item</v-list-item-title>
      <v-list-item-subtitle>Secondary text</v-list-item-subtitle>
    </v-list-item-content>
  </v-list-item>
  
  <v-list-item three-line>
    <v-list-item-content>
      <v-list-item-title>Three-line item</v-list-item-title>
      <v-list-item-subtitle>
        Secondary line text Lorem ipsum dolor sit amet,
      </v-list-item-subtitle>
      <v-list-item-subtitle>
        consectetur adipiscing elit.
      </v-list-item-subtitle>
    </v-list-item-content>
  </v-list-item>
</v-layout>