troylusty.com/src/components/ShowcasePost.astro

31 lines
923 B
Text

---
import FormattedDate from "@components/FormattedDate.astro";
import type { CollectionEntry } from "astro:content";
import { Icon } from "astro-icon/components";
type Props = {
collection: CollectionEntry<"posts" | "projects">;
};
const { collection } = Astro.props;
---
<li>
<a
class="group hover:bg-tertiary/30 bg-none"
href={`/${collection.collection}/${collection.slug}`}
>
<article class="flex flex-col">
<div class="flex flex-col justify-between md:flex-row md:items-center">
<h3 class="text-secondary mb-1 text-lg font-semibold text-nowrap">
{collection.data.title}
</h3>
<div class="text-tertiary flex items-center gap-2">
<Icon name="mdi:calendar" />
<FormattedDate date={collection.data.date} />
</div>
</div>
<p class="text-tertiary text-pretty">{collection.data.description}</p>
</article>
</a>
</li>