breadone/Recipie
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[PIE-8] Add recipe detail view #6

Merged
breadone merged 17 commits from PIE-8 into main 2025-08-13 16:54:06 +12:00
Conversation 0 Commits 17 Files Changed 15 +16 -13
3 changed files with 16 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit eae36b8da5 - Show all commits

4
src/layouts/base.astro
View File

@ -10,7 +10,9 @@ import Header from "@/components/Header";
<body> <body>
<main id="main" class="flex-1"> <main id="main" class="flex-1">
<Header/> <Header/>
<slot /> <div class="px-5 pt-2">
<slot />
</div>
</main> </main>
</body> </body>
</html> </html>

20
src/pages/index.astro
View File

@ -7,18 +7,16 @@ const recipies = await client.collection("recipes").getFullList()
--- ---
<PageLayout> <PageLayout>
<div id="content" class="p-5 pt-2"> <!-- <p class="pb-2">What would you like today?</p> -->
<!-- <p class="pb-2">What would you like today?</p> -->
<div class="grid gap-2 grid-cols-1 md:grid-cols-2 lg:grid-cols-4"> <div class="grid gap-2 grid-cols-1 md:grid-cols-2 lg:grid-cols-4">
{ {
recipies.map(r => ( recipies.map(r => (
<a href={`/recipe/${r.id}`}> <a href={`/recipe/${r.id}`}>
<OverviewCard recipe={r} /> <OverviewCard recipe={r} />
</a> </a>
)) ))
} }
</div>
</div> </div>
</PageLayout> </PageLayout>

5
src/pages/recipe/[slug].astro
View File

@ -1,9 +1,12 @@
--- ---
import client from "@/data/pocketbase"; import client from "@/data/pocketbase";
import SiteLayout from "@/layouts/base";
const { slug } = Astro.params; const { slug } = Astro.params;
const re = await client.collection("recipes").getOne(slug ?? "0"); const re = await client.collection("recipes").getOne(slug ?? "0");
--- ---
{re.name} <SiteLayout>
{re.name}
</SiteLayout>