67 lines
1.9 KiB
Plaintext
67 lines
1.9 KiB
Plaintext
---
|
|
import { type CollectionEntry, getCollection } from "astro:content";
|
|
import { Image } from "astro:assets";
|
|
|
|
import { SITE } from "@/siteConfig.ts";
|
|
|
|
import BaseLayout from "@/layouts/BaseLayout.astro";
|
|
|
|
import SeoPost from "@/components/SeoPost.astro";
|
|
|
|
import { formatDate } from "@/lib/util";
|
|
|
|
interface Props {
|
|
entry: CollectionEntry<"blog">;
|
|
}
|
|
|
|
export async function getStaticPaths() {
|
|
const blog = await getCollection("blog");
|
|
return blog.map((entry) => ({
|
|
params: { slug: entry.slug },
|
|
props: { entry },
|
|
}));
|
|
}
|
|
|
|
const { entry } = Astro.props;
|
|
const { Content } = await entry.render();
|
|
---
|
|
|
|
<BaseLayout>
|
|
<SeoPost slot="head" entry={entry} />
|
|
<main>
|
|
<a
|
|
href="/"
|
|
class="block py-3 text-lg font-JetBrainsMono uppercase text-lightModeForegroundMuted underline underline-offset-4 hover:text-lightModeForeground dark:text-darkModeForegroundMuted dark:hover:text-darkModeForeground"
|
|
>{`← ${SITE.name}`}</a
|
|
>
|
|
{
|
|
entry.data.image && (
|
|
<Image
|
|
src={entry.data.image}
|
|
alt={entry.data.imageAlt || ""}
|
|
class="mt-10 h-auto w-full"
|
|
/>
|
|
)
|
|
}
|
|
<h1
|
|
class="mt-6 flex flex-wrap justify-center text-balance text-2xl font-JetBrainsMono text-lightModeForeground dark:text-darkModeForeground"
|
|
>
|
|
{entry.data.title}
|
|
</h1>
|
|
<p
|
|
class="text-center text-sm text-lightModeForegroundMuted dark:text-darkModeForegroundMuted"
|
|
>
|
|
{formatDate(entry.data.publicationDate)}
|
|
</p>
|
|
<hr class="my-6 opacity-50" />
|
|
<div class="prose mx-auto mb-16 dark:prose-invert">
|
|
<Content />
|
|
</div>
|
|
<a
|
|
href="/"
|
|
class="block py-3 text-lg font-JetBrainsMono uppercase text-lightModeForegroundMuted underline underline-offset-4 hover:text-lightModeForeground dark:text-darkModeForegroundMuted dark:hover:text-darkModeForeground"
|
|
>{`← ${SITE.name}`}</a
|
|
>
|
|
</main>
|
|
</BaseLayout>
|