52 lines
1.9 KiB
Svelte
52 lines
1.9 KiB
Svelte
<script lang="ts">
|
|
import PhotoBackground from "$lib/components/PhotoBackground.svelte";
|
|
|
|
const thanks = [
|
|
{ name: "Gayle Muller-Lombard", role: "Mother of the Bride" },
|
|
{ name: "Jan Lombard", role: "Stepdad of the Bride" },
|
|
{ name: "Vera Muller", role: "Grandmother of the Bride" },
|
|
{ name: "Christian Els", role: "Cousin of the Bride" },
|
|
{ name: "Divan Swart", role: "Father of the Bride" },
|
|
{ name: "Louis Pietser", role: "Father of the Groom" },
|
|
{ name: "Dezelle Ras", role: "Friend" },
|
|
{ name: "Cindy Berriman-Puth", role: "Friend" },
|
|
{ name: "Hein Puth (Warky Devs)", role: "Website & Friend" },
|
|
{ name: "Ronel Gous", role: "Ronel Events and Designs & Friend" },
|
|
{ name: "Monica", role: "Rivier Plaas Wedding Venue" },
|
|
{ name: "Anton (Music Fanatics)", role: "DJ" },
|
|
{ name: "Alan Cameron (AA Photography)", role: "Photography" },
|
|
];
|
|
</script>
|
|
|
|
<section
|
|
class="relative flex flex-1 items-center justify-center overflow-hidden px-4 py-16 z-10"
|
|
>
|
|
<PhotoBackground />
|
|
|
|
<div
|
|
class="border-surface-50/70 text-shadow-sm text-shadow-black/60 relative z-10 w-full max-w-md border px-6 py-12 sm:px-14 sm:py-16"
|
|
>
|
|
<h1 class="text-surface-50 font-serif text-4xl">
|
|
A Special Note of Thanks
|
|
</h1>
|
|
<p class="text-surface-100 mt-2 text-2xl">
|
|
To some very special people in our lives who have helped us make our day
|
|
magical:
|
|
</p>
|
|
<ul class="mt-4 flex flex-col gap-2">
|
|
{#each thanks as person (person.name)}
|
|
<li
|
|
class="border-surface-50/30 flex items-center justify-between border-b py-2"
|
|
>
|
|
<span class="text-surface-50 text-2xl">{person.name}</span>
|
|
<span class="text-secondary-300 text-lg">{person.role}</span>
|
|
</li>
|
|
{/each}
|
|
</ul>
|
|
<p class="text-surface-100 mt-6 text-xl">
|
|
If there is anyone we have forgotten about, please know that you are all
|
|
special to us!
|
|
</p>
|
|
</div>
|
|
</section>
|