Files
c0ntroller.de/src/pages/blog/[...slug].astro
T

43 lines
1.1 KiB
Plaintext

---
import { getCollection, render } from 'astro:content';
import BaseLayout from '../../layouts/BaseLayout.astro';
import "katex/dist/katex.min.css";
// @ts-expect-error Theme is not provided as ".css"
import "satteri-callouts/theme/obsidian";
export async function getStaticPaths() {
const blogEntries = await getCollection('blog');
return blogEntries.map(entry => ({
params: { slug: entry.id }, props: { entry },
}));
}
const { entry } = Astro.props;
const { Content } = await render(entry);
---
<BaseLayout title={entry.data.title} theme="blog">
<div class="glass-container header" style={`view-transition-name: blog-header-${entry.id};`}>
<h1 style={`view-transition-name: blog-headline-${entry.id};`}>{entry.data.title}</h1>
<div class="meta">
<time style={`view-transition-name: blog-pubdate-${entry.id};`}>{entry.data.pubDate.toLocaleDateString("de-DE")}</time>
</div>
</div>
<div class="glass-container content prose">
<Content />
</div>
</BaseLayout>
<style>
.header {
margin-bottom: 2rem;
}
.meta {
opacity: 0.7;
margin-top: 0.5rem;
}
.content {
line-height: 1.8;
}
</style>