[PIE-13] New recipe page #11
@ -3,10 +3,10 @@ import { record } from "astro:schema"
|
||||
import client from "@/data/pocketbase"
|
||||
import StepIngredientSideView from "./StepIngredientSideView.astro"
|
||||
|
||||
const { steps } = Astro.props
|
||||
const { steps, class: className } = Astro.props
|
||||
---
|
||||
|
||||
<div class="md:ml-5 mt-2 md:mt-0">
|
||||
<div class={className}>
|
||||
<p class="text-[22pt] font-bold md:hidden">Steps</p>
|
||||
{ steps.map(s => (
|
||||
<div class="bg-[#2a2b2c] rounded-lg mb-2 p-3">
|
||||
|
@ -31,7 +31,7 @@ const ingredients = await Promise.all(
|
||||
<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 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>
|
||||
<p class="text-[28pt] font-bold leading-none mt-2">{re.name}</p>
|
||||
|
||||
<!-- Details -->
|
||||
<InfoView re={re} />
|
||||
@ -40,11 +40,9 @@ const ingredients = await Promise.all(
|
||||
<IngredientTableView class:list={['md:w-80', 'px-4']} ingredients={ingredients} />
|
||||
</div>
|
||||
|
||||
<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>
|
||||
|
||||
<div class="flex mt-4 md:flex-2/3 w-full flex-col">
|
||||
<!-- Steps -->
|
||||
<StepView steps={steps} />
|
||||
<StepView class="md:ml-3" steps={steps} />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
Loading…
x
Reference in New Issue
Block a user