---
import PageLayout from "@/layouts/base"
import client from "@/data/pocketbase"
import OverviewCard from "@/components/Card/OverviewCard"

const recipes = await client.getAllRecipes()
---

<PageLayout>	
	<!-- <p class="pb-2">What would you like today?</p> -->

	<div class="grid md:gap-2 gap-3 grid-cols-2 md:grid-cols-2 lg:grid-cols-4 xl:grid-cols-8">
		{
			recipes.map(r => (
				<OverviewCard recipe={r} />
			))
		}
	</div>

</PageLayout>