fix(ui): update wedding details and add new pages

* change RSVP deadline and venue details * add venue and wedding party pages with relevant information * enhance layout with additional meta descriptions and links
2026-08-23 10:19:26 +02:00
parent 3c8f07978c
commit 4eddecea8e
7 changed files with 318 additions and 10 deletions
@@ -0,0 +1,127 @@
+<script lang="ts">
+  const bride = [
+    {
+      role: "Maid of Honour",
+      name: "Mart-Marie Neethling",
+      note: "Keeper of the bride's sanity and secrets.",
+    },
+    {
+      role: "Bridesmaid",
+      name: "Bronwin Williams",
+      note: "Childhood friend and the leader of the ultimate hype squad.",
+    },
+    {
+      role: "Bridesmaid",
+      name: "Noel Du Toit",
+      note: '"The life of every party" — Cousin.',
+    },
+    {
+      role: "Flower Girl",
+      name: "Echo",
+      note: "The cutest little Flower Girl ever seen.",
+    },
+  ];
+
+  const groom = [
+    {
+      role: "Best Man",
+      name: "Justin Pieterse",
+      note: "Tasked with keeping the speech short and the groom sane. (Not that the groom has ever been sane.)",
+    },
+    {
+      role: "Groomsman",
+      name: "Harold Harding",
+      note: "Childhood friend, and always has the groom's back.",
+    },
+    {
+      role: "Groomsman",
+      name: "Dehan Kruger",
+      note: "Chilled, laid back, and the life of every party!",
+    },
+    {
+      role: "Groomsman",
+      name: "Karabo Makhubo",
+      note: "Sharp dresser, always with a joke to share.",
+    },
+  ];
+
+  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 Bierman", role: "Friend" },
+    { name: "Ronel Gous", role: "Ronel Events and Designs & Friend" },
+    { name: "Monica", role: "Rivier Plaas Wedding Venue" },
+  ];
+</script>
+
+<section class="flex flex-1 items-center justify-center px-4 py-16">
+  <div class="w-full max-w-md">
+    <h1 class="font-serif text-4xl">The I-Do Crew</h1>
+    <p class="text-surface-600-400 mt-2 text-2xl">
+      Meet the legendary lineup helping us make it down the aisle at Rivier
+      Plaas!
+    </p>
+
+    <div class="border-surface-300 dark:border-surface-700 mt-10 border-t pt-6">
+      <h2 class="font-serif text-3xl">Behind the Bride</h2>
+      <ul class="mt-4 flex flex-col gap-4">
+        {#each bride as person (person.name)}
+          <li>
+            <p class="text-2xl">
+              <span class="font-medium">{person.role}:</span>
+              {person.name}
+            </p>
+            <p class="text-surface-600-400 text-xl">{person.note}</p>
+          </li>
+        {/each}
+      </ul>
+    </div>
+
+    <div class="border-surface-300 dark:border-surface-700 mt-10 border-t pt-6">
+      <h2 class="font-serif text-3xl">Behind the Groom</h2>
+      <ul class="mt-4 flex flex-col gap-4">
+        {#each groom as person (person.name)}
+          <li>
+            <p class="text-2xl">
+              <span class="font-medium">{person.role}:</span>
+              {person.name}
+            </p>
+            <p class="text-surface-600-400 text-xl">{person.note}</p>
+          </li>
+        {/each}
+      </ul>
+    </div>
+
+    <div class="border-surface-300 dark:border-surface-700 mt-10 border-t pt-6">
+      <h2 class="font-serif text-3xl">The Dog-bearers</h2>
+      <p class="mt-2 text-2xl">Roxi &amp; Chloe Muller</p>
+    </div>
+
+    <div class="border-surface-300 dark:border-surface-700 mt-10 border-t pt-6">
+      <h2 class="font-serif text-3xl">A Special Note of Thanks</h2>
+      <p class="text-surface-600-400 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-300 dark:border-surface-700 flex items-center justify-between border-b py-2"
+          >
+            <span class="text-2xl">{person.name}</span>
+            <span class="text-surface-600-400 text-lg">{person.role}</span>
+          </li>
+        {/each}
+      </ul>
+      <p class="text-surface-600-400 mt-6 text-xl">
+        If there is anyone we have forgotten about, please know that you are
+        all special to us!
+      </p>
+    </div>
+  </div>
+</section>