CraftAttack/website
4
0
Fork 0
Code Issues 3 Pull Requests Actions Wiki Activity

update to svelte 5
All checks were successful
delpoy / build-and-deploy (push) Successful in 35s
Details

Browse Source
This commit is contained in:
bytedream
2024-12-02 00:28:43 +01:00
parent abffa440a1
commit 95968148a6
53 changed files with 2199 additions and 2002 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/lib/components/Countdown/Countdown.svelte
View File

@ -2,10 +2,7 @@
import { onDestroy } from 'svelte';
import { env } from '$env/dynamic/public';
// start date in milliseconds. if undefined, start will be Date.now
export let start: number | undefined = undefined;
// end date in milliseconds
export let end: number;
let { start, end }: { start?: number; end: number } = $props();
let title = `Spielstart ist am ${new Date(env.PUBLIC_START_DATE).toLocaleString('de-DE', {
day: '2-digit',
@ -26,7 +23,7 @@
];
}
let [days, hours, minutes, seconds] = getUntil();
let [days, hours, minutes, seconds] = $state(getUntil());
let intervalId = setInterval(() => {
[days, hours, minutes, seconds] = getUntil();
if (start) start += 1000;
@ -41,25 +38,25 @@
>
<div class="flex flex-col p-2 bg-gray-200 rounded-box bg-opacity-5 backdrop-blur-sm" {title}>
<span class="countdown font-mono text-3xl sm:text-6xl">
<span class="m-auto" style="--value:{days};" />
<span class="m-auto" style="--value:{days};"></span>
</span>
Tage
</div>
<div class="flex flex-col p-2 bg-gray-200 rounded-box bg-opacity-5 backdrop-blur-sm" {title}>
<span class="countdown font-mono text-3xl sm:text-6xl">
<span class="m-auto" style="--value:{hours};" />
<span class="m-auto" style="--value:{hours};"></span>
</span>
Stunden
</div>
<div class="flex flex-col p-2 bg-gray-200 rounded-box bg-opacity-5 backdrop-blur-sm" {title}>
<span class="countdown font-mono text-3xl sm:text-6xl">
<span class="m-auto" style="--value:{minutes};" />
<span class="m-auto" style="--value:{minutes};"></span>
</span>
Minuten
</div>
<div class="flex flex-col p-2 bg-gray-200 rounded-box bg-opacity-5 backdrop-blur-sm" {title}>
<span class="countdown font-mono text-3xl sm:text-6xl">
<span class="m-auto" style="--value:{seconds};" />
<span class="m-auto" style="--value:{seconds};"></span>
</span>
Sekunden
</div>