strudel/website/src/components/BlogPost.astro
2024-01-14 23:39:03 +01:00

28 lines
934 B
Plaintext

---
import type { CollectionEntry } from 'astro:content';
type Props = CollectionEntry<'blog'>['data'];
const { post } = Astro.props;
const { Content } = await post.render();
import { format } from 'date-fns';
---
<article
class="prose max-w-none prose-headings:font-sans prose-headings:font-black prose-headings:text-slate-900 dark:prose-headings:text-gray-200 dark:text-gray-400 dark:prose-strong:text-gray-400 dark:prose-code:text-slate-400 dark:prose-a:text-gray-300 prose-a:text-slate-900 prose-blockquote:text-slate-800 dark:prose-blockquote:text-slate-400"
>
<div class="pb-2">
<div class="md:flex justify-between">
<h1 class="mb-4" id={post.slug}>{post.data.title}</h1>
</div>
<p class="italic p-0 m-0">
<time datetime={post.data.date.toISOString()}>
{format(post.data.date, 'MMMM yyyy')} by {post.data.author}
</time>
</p>
</div>
<div>
<Content />
</div>
</article>