june
6145f14df0
Custom API client to handle a lot of the more type safe queries Reviewed-on: #12 Co-authored-by: june <self@breadone.net> Co-committed-by: june <self@breadone.net>
30 lines
950 B
Plaintext
30 lines
950 B
Plaintext
---
|
|
import client from "@/data/pocketbase"
|
|
import TagRow from "./TagRow.astro"
|
|
|
|
const { recipe } = Astro.props;
|
|
|
|
const image = (await client.getRecipeImages(recipe.id))[0]
|
|
---
|
|
|
|
<div class="relative z-0 flex h-50">
|
|
<img
|
|
class="w-full h-full object-cover rounded-xl"
|
|
src={ image }
|
|
/>
|
|
|
|
<div id="bottom-info-panel" class="absolute bottom-0 left-0 w-full p-2 h-20 backdrop-filter backdrop-blur-lg rounded-b-xl z-1">
|
|
<p id="recipe-name" class="text-[14pt] text-white opacity-90 font-bold line-clamp-1" >{recipe.name}</p>
|
|
<!-- <p id="recipe-desc" class="text-white text-[10pt]"> {recipe.description} </p> -->
|
|
|
|
<div id="tag-row" class="">
|
|
<TagRow tags={recipe.expand.tags}/>
|
|
</div>
|
|
</div>
|
|
|
|
<a id="link" href={`/recipe/${recipe.id}`} class="absolute inset-0 z-0">
|
|
<span class="block w-full h-full hover:bg-black/10 transition-colors">
|
|
</span>
|
|
</a>
|
|
|
|
</div> |