File size: 703 Bytes
78b5416 bea2d0b 78b5416 |
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 32 |
<script lang="ts">
export let message: string = '';
let timeout = 0;
$: if (message !== '') {
console.log('message', message);
clearTimeout(timeout);
timeout = setTimeout(() => {
message = '';
}, 5000);
}
</script>
{#if message}
<div role="alert" class="fixed right-0 top-0 m-4">
<button
type="button"
class="w-full"
on:click={() => (message = '')}
on:keydown={(e) => e.key === 'Enter' && (message = '')}
>
<div class="rounded bg-red-800 p-4 text-white">
{message}
</div>
<div class="bar transition-all duration-500" style="width: 0;"></div>
</button>
</div>
{/if}
<style lang="postcss" scoped>
</style>
|