48 lines
1.2 KiB
Plaintext
48 lines
1.2 KiB
Plaintext
---
|
|
import { Image } from 'astro:assets';
|
|
|
|
import type { Post } from '@lib/directusTypes';
|
|
|
|
import PostMetadataSnippet from '@/components/snippets/PostMetadataSnippet.astro';
|
|
import { getDirectusImageURL } from '@/support/url';
|
|
|
|
interface Props {
|
|
post: Post;
|
|
}
|
|
|
|
const { post } = Astro.props;
|
|
---
|
|
|
|
<div class="smooth-reveal-cards group flex flex-col">
|
|
<a
|
|
class="card-base border-none! h-full flex flex-col"
|
|
href={`/blog/${post.slug}/`}
|
|
data-astro-prefetch
|
|
>
|
|
<div class="relative shrink-0 rounded-t-xl w-full overflow-hidden before:absolute before:inset-x-0 before:z-1 before:size-full">
|
|
<Image
|
|
class="rounded-t-xl h-64 w-full object-cover"
|
|
src={getDirectusImageURL(post.image)}
|
|
alt={post.image_alt}
|
|
draggable="false"
|
|
loading="eager"
|
|
format="webp"
|
|
inferSize={true}
|
|
/>
|
|
</div>
|
|
<div class="flex flex-col flex-1 rounded-xl p-4 md:p-5 mx-1 mb-2">
|
|
<div class="flex flex-row items-center mb-8">
|
|
<h3 class="card-text-title card-hover-text-title text-2xl">
|
|
{post.title}
|
|
</h3>
|
|
</div>
|
|
<div class="mt-auto">
|
|
<PostMetadataSnippet
|
|
enableCategoryLink={false}
|
|
post={post}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|