27 lines
859 B
Plaintext
27 lines
859 B
Plaintext
---
|
|
import TagRow from "@component/tagRow"
|
|
|
|
const { id, title, description, tags, image } = Astro.props
|
|
|
|
---
|
|
|
|
<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" >{title}</p>
|
|
<!-- <p id="recipe-desc" class="text-white text-[10pt]"> {recipe.description} </p> -->
|
|
|
|
<div id="tag-row" class="line-clamp-1">
|
|
<TagRow tags={tags}/>
|
|
</div>
|
|
</div>
|
|
|
|
<a id="link" href={`/recipe/${id}`} class="absolute inset-0 z-0">
|
|
<span class="block w-full h-full hover:bg-black/10 transition-colors">
|
|
</span>
|
|
</a>
|
|
</div> |