Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 2x 2x 1x 1x 1x 2x 1x 1x 1x 1x | <template>
<transition name="fade">
<div class="fixed w-full h-full left-0 top-0 flex z-100 transition-all" v-if="show">
<div :class="['m-auto bg-black bg-opacity-40 text-white px-4 py-2 rounded-2']">
{{ text }}
</div>
</div>
</transition>
</template>
<script setup lang="ts">
interface ToastType {
text: string
time?: number
}
const props = defineProps<ToastType>()
const show = defineModel({ default: false })
watch(show, () => {
if (show.value) {
setTimeout(() => {
show.value = false
}, props.time || 2000)
}
})
</script>
<style scoped></style>
|