From dc8649747469c7a3cdb9214b47298eab8673f2b6 Mon Sep 17 00:00:00 2001
From: june <self@breadone.net>
Date: Wed, 13 Aug 2025 23:59:48 +1200
Subject: [PATCH] fix edge-case layout bug

---
 src/pages/recipe/[recipeid].astro | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/pages/recipe/[recipeid].astro b/src/pages/recipe/[recipeid].astro
index a760c77..6554145 100644
--- a/src/pages/recipe/[recipeid].astro
+++ b/src/pages/recipe/[recipeid].astro
@@ -29,7 +29,7 @@ const ingredients = await Promise.all(
 
 <SiteLayout>
     <div class="flex flex-col md:flex-row mx-auto justify-center w-full lg:max-w-3/4 xl:max-w-2/3 2xl:max-w-1/2">
-        <div class="flex flex-col mt-2 md:mt-4 sticky">
+        <div class="flex md:flex-1/3 flex-col mt-2 md:mt-4 sticky">
             <ImageCarousel class="w-full" recipe={re} />
             <p class=" md:hidden text-[28pt] font-bold leading-none mt-2">{re.name}</p>
 
@@ -40,7 +40,7 @@ const ingredients = await Promise.all(
             <IngredientTableView class:list={['md:w-80', 'px-4']} ingredients={ingredients}  />
         </div>
         
-        <div class="flex w-full flex-col">
+        <div class="flex md:flex-2/3 w-full flex-col">
             <p class="hidden md:block text-[28pt] font-bold pl-5">{re.name}</p>
 
             <!-- Steps -->