Files
txarli.dev/src/layouts/BlogPost.astro

64 lines
1.3 KiB
Plaintext

---
import { getCollection } from "astro:content";
import BaseHead from "../components/BaseHead.astro";
import Header from "../components/Header.astro";
import Footer from "../components/Footer.astro";
import ColorScript from "../components/ColorScript.astro";
import Tags from "../components/Tags.astro";
import getTags from "../scripts/getTags";
const posts = await getCollection("posts");
const allTags = getTags(posts);
let {
content: { title, description, added, updated, tags, heroImage },
} = Astro.props;
added = new Date(added).toLocaleDateString(
"eu",
{
year: "numeric",
month: "short",
day: "numeric",
}
);
if (updated) {
updated = new Date(updated).toLocaleDateString(
"eu",
{
year: "numeric",
month: "short",
day: "numeric",
}
);
}
---
<html lang="eu">
<BaseHead title={title} description={description} />
<body>
<Header />
<main>
<article>
{heroImage && <img width={720} height={360} src={heroImage} alt="" />}
<h1 class="article-title">{title}</h1>
{updated ?
<span><time>{added}</time>, last updated on <time>{updated}</time></span>
:
<span>{added && <time>{added}</time>}</span>
}
<Tags tags={tags} />
<hr />
<div class="blog-post">
<slot />
</div>
</article>
</main>
<Tags tags={allTags} all />
<Footer />
<ColorScript />
</body>
</html>