ZvSnackbar
ZvSnackbar is a standalone component
INFO
Before you have to import the global css files in your project, follow instructions in Getting Started
Basic usage
Hello, world!
vue
<template>
<ZvButton @click="snackbarValue = true" size="medium"> Show snackbar </ZvButton>
<ZvSnackbar v-model="snackbarValue">
Hello, world!
<template #right-content>
<a href="/" class="text-white lg:text-success"> Voir le panier </a>
</template>
</ZvSnackbar>
</template>
<script lang="ts" setup>
import ZvSnackbar from '@zadigetvoltaire/ui/components/ZvSnackbar'
import ZvButton from '@zadigetvoltaire/ui/components/ZvButton'
import { ref } from 'vue'
const snackbarValue = ref(true)
</script>Error
Hello, world!
html
<ZvSnackbar v-model="snackbarValue" :timeout-delay="5000" variant="error"> Hello, world! </ZvSnackbar>Warning
Hello, world!
html
<ZvSnackbar v-model="snackbarValue" :timeout-delay="5000" variant="warning"> Hello, world! </ZvSnackbar>No closable
Hello, world!
html
<ZvSnackbar v-model="snackbarValue" :timeout-delay="5000" no-closable> Hello, world! </ZvSnackbar>