dress the menu up

tjheffner · Dec 3, 2023 · c8e3bf6 · c8e3bf6
1 parent bdb4037
commit c8e3bf6
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 15 deletions.
diff --git a/src/routes/(nowrapper)/christmas/+page.svelte b/src/routes/(nowrapper)/christmas/+page.svelte
@@ -121,29 +121,35 @@
 </div>
 
 <section class="pt-[10rem] h-full text-center text-white serif">
-  <h1 class="">{data.title}</h1>
-  <p class="">{data.where}<p>
-  <p class="">{data.when}</p>
+  <h1 class="text-6xl mb-10 text-shadow">{data.title}</h1>
+  <p>at</p>
+  <p class="text-3xl mt-6 mb-12 text-shadow">{data.where} | <span class="sans">{data.when}</span><p>
+  <!-- <p class="text-4xl sans">{data.when}</p>
+  <p class="text-4xl my-6">at {data.where}<p> -->
 
+
+  <h2 class="text-2xl mt-20 mb-6 underline underline-offset-4">Schedule</h2>
   <ul class="list-none">
   {#each data.agenda as {event, time}}
-    <li class="">{event} - {time}</li>
+    <li class="my-2">
+      <p class="text-lg">{event} - <span class="sans">{time}<span></p>
+    </li>
   {/each}
   </ul>
 
 
-  <p> For dinner... </p>
+  <h2 class="text-2xl mt-20 mb-6 underline underline-offset-4"> Menu </h2>
 
   <ul class="list-none">
   {#each data.menu as {name, ingredients}}
-    <li class="">
-      <p class="">{name}</p>
+    <li class="my-6">
+      <p class="text-lg">{name}</p>
       <p class="sans">{ingredients}</p>
     </li>
   {/each}
   </ul>
 
-  <p class="">{data.disclaimer}</p>
+  <p class="mt-12 text-md">{data.disclaimer}</p>
 
 </section>
 

diff --git a/src/routes/(nowrapper)/christmas/christmas.css b/src/routes/(nowrapper)/christmas/christmas.css
@@ -1,3 +1,6 @@
+body {
+  background-color: rgb(17 24 39 / var(--tw-bg-opacity)) !important;
+}
 body::-webkit-scrollbar-thumb {
   background: repeating-linear-gradient(60deg, red 0 9%, white 10% 18%) !important;
   border-radius: 100vw !important;
@@ -15,9 +18,9 @@ body::-webkit-scrollbar-track {
 }
 
 #snow {
+  position: fixed;
   height: 100%;
   left: 0;
-  position: absolute;
   top: 0;
   width: 100%;
   z-index: 1;

diff --git a/src/routes/(nowrapper)/christmas/christmas.js b/src/routes/(nowrapper)/christmas/christmas.js
@@ -1,5 +1,5 @@
 export const json = {
-  "title": "christmas dinner 2023",
+  "title": "Christmas Dinner",
   "where": "the purr palace",
   "when": "december 23, 2023",
   "agenda": [
@@ -14,24 +14,28 @@ export const json = {
     {
       "event": "presents",
       "time": "eventually"
+    },
+    {
+      "event": "fun & games",
+      "time": "throughout"
     }
   ],
   "menu": [
     {
       "name": "baked potato soup",
-      "ingredients": "yukon gold potato, cream, roasted pork belly, topped with chives and cheese"
+      "ingredients": "yukon gold potatoes, cream, roasted pork belly, chives, cheese"
     },
     {
       "name": "winter salad",
-      "ingredients": "mixed greens, apples, cranberries, walnuts, tossed with cranberry vinaigrette",
+      "ingredients": "mixed greens, apples, cranberries, walnuts, cranberry vinaigrette",
     },
     {
       "name": "duck a l'orange",
-      "ingredients": "roasted duck breast with an orange pan sauce, accompanied by porcini mushroom risotto and baked vegetables"
+      "ingredients": "roasted duck breast, orange pan sauce, porcini mushroom risotto, baked vegetables",
     },
     {
-      "name": "assorted desserts",
-      "ingredients": "creme brulee, festive cookies, mousse"
+      "name": "dessert",
+      "ingredients": "creme brulee, assorted cookies, mousse"
     }
   ],
   "disclaimer": "all items are gluten-free, however some may contain dairy products"