From 93e3fc6db5b788a48dc6499502c9666caa0ad8c4 Mon Sep 17 00:00:00 2001
From: june <self@breadone.net>
Date: Wed, 13 Aug 2025 15:32:29 +1200
Subject: [PATCH] Table formatting

---
 src/components/Detail/IngredientTableView.astro | 14 +++++++-------
 src/pages/recipe/[recipeid].astro               |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/components/Detail/IngredientTableView.astro b/src/components/Detail/IngredientTableView.astro
index 8d6951c..1f38027 100644
--- a/src/components/Detail/IngredientTableView.astro
+++ b/src/components/Detail/IngredientTableView.astro
@@ -18,12 +18,12 @@ const { class: className, ingredients } = Astro.props
 
 </div> -->
 
-<table class={`table-auto bg-[#2a2b2c] rounded-lg ${className} w-full`}>
+<table class={`table-auto text-left bg-[#2a2b2c] rounded-lg ${className} w-full`}>
     <thead>
         <tr>
-            <th class="text-center px-4 py-2">Quantity</th>
-            <th class="text-center px-4 py-2">Unit</th>
-            <th class="text-center px-4 py-2">Food</th>
+            <th class="px-4 py-2">Quantity</th>
+            <th class="px-4 py-2">Unit</th>
+            <th class="px-4 py-2">Food</th>
         </tr>
     </thead>
     <tbody>
@@ -31,9 +31,9 @@ const { class: className, ingredients } = Astro.props
         ingredients.map(ing => (
             <>
                 <tr class="border-t border-gray-600">
-                    <td class="text-left px-4 py-2">{ing.quantity}</td>
-                    <td class="text-left px-4 py-2">{ing.unit}</td>
-                    <td class="text-left px-4 py-2">{ing.name}</td>
+                    <td class="px-4 py-2">{ing.quantity}</td>
+                    <td class="px-4 py-2">{ing.unit}</td>
+                    <td class="px-4 py-2">{ing.name}</td>
                 </tr>
             </>
         ))
diff --git a/src/pages/recipe/[recipeid].astro b/src/pages/recipe/[recipeid].astro
index 0cae90b..75662ef 100644
--- a/src/pages/recipe/[recipeid].astro
+++ b/src/pages/recipe/[recipeid].astro
@@ -41,7 +41,7 @@ const ingredients = await Promise.all(
                 <p class="text-[22pt] font-bold">Steps</p>
                 { steps.map(s => (
                     <div class="bg-[#2a2b2c] rounded-lg mb-2 p-3 md:">
-                        <p>Step {s.index + 1}</p>
+                        <p class="text-bold text-[10pt]">Step {s.index + 1}</p>
                         <p>{s.instruction}</p>
                     </div>
                 )) }