feat: date component updates in realtime

This commit is contained in:
metamethods 2025-01-03 00:06:08 -08:00
parent 827b7ef98a
commit 26103814ac

View File

@ -1,13 +1,19 @@
<script lang="ts">
const { date }: { date: Date } = $props();
const difference = new Date().getTime() / 1000 - date.getTime() / 1000;
const seconds = ~~(difference % 60);
const minutes = ~~(difference / 60) % 60;
const hours = ~~(difference / 3600) % 24;
const days = ~~(difference / 86400);
let currentDate = $state(Date.now());
let difference = $derived(currentDate / 1000 - date.getTime() / 1000);
let seconds = $derived(~~(difference % 60));
let minutes = $derived(~~(difference / 60) % 60);
let hours = $derived(~~(difference / 3600) % 24);
let days = $derived(~~(difference / 86400));
setInterval(() => {
currentDate = Date.now();
});
</script>
<p class="group underline">
<span class="group underline">
<span class="group-hover:hidden">
about
{#if minutes == 0}
@ -24,4 +30,4 @@
<span class="hidden group-hover:block">
{date.toLocaleString()}
</span>
</p>
</span>