<template>
  <v-app>
    <v-container>
      <v-sheet
        theme="dark"
        class="d-flex flex-column"
      >
        <v-snackbar
          :timeout="2000"
          color="primary"
          variant="tonal"
        >
          <template v-slot:activator="{ props }">
            <v-btn class="ma-2" color="primary" variant="tonal" v-bind="props">open</v-btn>
          </template>

          Snackbar with <strong>tonal</strong> variant.
        </v-snackbar>

        <v-snackbar
          :timeout="2000"
          color="success"
          variant="outlined"
        >
          <template v-slot:activator="{ props }">
            <v-btn class="ma-2" color="success" variant="outlined" v-bind="props">open</v-btn>
          </template>

          Snackbar with <strong>outlined</strong> variant.
        </v-snackbar>

        <v-snackbar
          :timeout="2000"
          color="success"
          variant="text"
        >
          <template v-slot:activator="{ props }">
            <v-btn class="ma-2" color="success" variant="text" v-bind="props">open</v-btn>
          </template>

          Snackbar with <strong>text</strong> variant.
        </v-snackbar>
      </v-sheet>
    </v-container>
  </v-app>
</template>
```‎