Maurice/mausenpeet.nl
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update

Browse Source
This commit is contained in:
Maurice 2025-03-03 22:24:23 +01:00
parent 846e3c2dd1
commit 7d90c6ea93
2 changed files with 69 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/app.html
View File

@ -2,8 +2,9 @@
<html lang="nl">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Maurice & Petra</title>
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 16 16'><text x='0' y='14'>❤️</text></svg>" />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">

70
src/routes/+page.svelte
View File

@ -4,17 +4,81 @@
const date = DateTime.fromISO('2025-05-15T12:00:00');
const daysLeft = Math.floor(date.diffNow().as('days'));
const today = date.startOf('day') === DateTime.now().startOf('day');
const after = date.endOf('day').diffNow().days > 1;
</script>
<main class="m-5">
<article class="prose mx-auto pt-5">
<div class="text-center font-['GreatVibes']">
<h1 class="md:text-7xl text-5xl font-thin mb-0 pb-0">Maurice & Petra</h1>
<h2 class="mt-0 pt-0 md:text-5xl text-3xl font-thin text-primary">trouwen {date.toLocaleString(DateTime.DATE_SHORT)}</h2>
<h2 class="mt-0 pt-0 md:text-5xl text-3xl font-thin text-primary">
{#if !after}
trouwen {today ? 'vandaag!' : date.toLocaleString(DateTime.DATE_SHORT)}
{:else}
zijn getrouwd!
{/if}
</h2>
<Counter {date} />
{#if !today && !after}
<Counter {date} />
<p class="text-2xl">Dus nog <span class="text-primary">{daysLeft}</span> nachtjes slapen</p>
<p class="text-2xl">Dus nog <span class="text-primary">{daysLeft}</span> nachtjes slapen</p>
{/if}
{#if today}
<h2 class="text-4xl">Dagprogramma</h2>
{/if}
</div>
{#if today}
<div class="text-center">
<div class="divider"></div>
<table class="table text-xl text-primary">
<thead>
<tr>
<th>Wat</th>
<th>Hoe laat</th>
<th>Waar</th>
</tr>
</thead>
<tbody>
<tr>
<td>Gemeentehuis</td>
<td>
<b>10:30</b>
</td>
<td>
<a href="https://maps.app.goo.gl/Y5xnRLUMUQhdFhsU8" target="_blank">Steenbergsestraat 8, Bergen op Zoom</a>
<br/>Parkeren: op <a href="https://goo.gl/maps/hRi5xEvwz8C2" target="_blank">Sint-Catharinaplein (Vismarkt)</a> of <a href="https://goo.gl/maps/5cJregSEoYx" target="_blank">het Mineurplein</a>
</td>
</tr>
<tr>
<td>Kerkdienst</td>
<td>
<b>14:00</b>
</td>
<td>
<a href="https://maps.app.goo.gl/8yJ3fgcB46SCmenB9" target="_blank">Johan Willem Frisostraat 1, Krabbendijke</a>
</td>
</tr>
<tr>
<td>Receptie</td>
<td>
<b>20:15</b>
</td>
<td>
Feestzaal van Partycentrum 't Appeltje, <a href="https://maps.app.goo.gl/o9bSSxf442bataHu6" target="_blank">Balsedreef 5, Bergen op Zoom</a>
</td>
</tr>
</tbody>
</table>
<div class="divider"></div>
</div>
{/if}
{#if after}
<div class="text-center text-3xl">
<p>Hartelijk dank voor uw medeleven/aanwezigheid!</p>
</div>
{/if}
<p class="text-3xl text-primary text-center font-['GreatVibes']">Wilt u ons wat geven?</p>
<div class="flex flex-wrap gap-3 justify-center">