Files
web-temp/layers/components/blocks/modal/Toast.vue

23 lines
727 B
Vue

<script setup lang="ts">
const modalStore = useModalStore()
const { toast } = modalStore
</script>
<template>
<Transition name="fade">
<div v-if="toast.storeIsOpen" class="toast-container">
<p v-dompurify-html="toast.storeContentText" class="toast-text"></p>
</div>
</Transition>
</template>
<style scoped>
.toast-container {
@apply fixed left-1/2 max-w-[328px] py-3 px-6 rounded-[8px] bg-[rgba(85,85,85,0.4)] backdrop-blur-[25px] -translate-x-1/2 bottom-[20px] md:bottom-[40px] z-[800]
before:content-[''] before:absolute before:inset-0 before:border before:border-white/10 before:rounded-[8px];
}
.toast-text {
@apply text-center text-[16px] text-white leading-[26px] tracking-[-0.48px];
}
</style>