chore(preset): handle transitions

This commit is contained in:
Benjamin Canac
2022-10-04 23:56:54 +02:00
parent e5bf052c1f
commit b20c8c82ab
6 changed files with 89 additions and 48 deletions

View File

@@ -1,13 +1,5 @@
<template>
<transition
appear
enter-class="translate-y-2 opacity-0 sm:translate-y-0 sm:translate-x-2"
enter-active-class="transition duration-300 ease-out transform"
enter-to-class="translate-y-0 opacity-100 sm:translate-x-0"
leave-class="opacity-100"
leave-active-class="transition duration-100 ease-in"
leave-to-class="opacity-0"
>
<transition appear v-bind="transitionClass">
<div
:class="['z-50 w-full pointer-events-auto', backgroundClass, roundedClass, shadowClass]"
@mouseover="onMouseover"
@@ -102,6 +94,10 @@ const props = defineProps({
type: String,
default: () => $ui.notification.rounded
},
transitionClass: {
type: Object,
default: () => $ui.notification.transition
},
customClass: {
type: String,
default: null