txarli/txarli.dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix date formatting, add tags to blog header

Browse Source
This commit is contained in:
Cassidy Williams
2023-12-31 00:26:04 -06:00
parent 6bd8c12a22
commit 37951dcf56
5 changed files with 36 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/Tags.astro
View File

@@ -1,9 +1,9 @@
---
const { tags } = Astro.props;
const { tags, all } = Astro.props;
---
<h3>View posts by tag</h3>
<p>
{all && <h3>View posts by tag</h3>}
<div>
{
tags &&
tags.map((tag) => (
@@ -15,4 +15,4 @@ const { tags } = Astro.props;
</>
))
}
</p>
</div>

29
src/layouts/BlogPost.astro
View File

@@ -7,11 +7,31 @@ import Tags from "../components/Tags.astro";
import getTags from "../scripts/getTags";
const posts = await Astro.glob("../posts/*.md");
const tags = getTags(posts);
const allTags = getTags(posts);
const {
content: { title, description, added, updated, heroImage },
let {
content: { title, description, added, updated, tags, heroImage },
} = Astro.props;
added = new Date(added).toLocaleDateString(
"en-us",
{
year: "numeric",
month: "short",
day: "numeric",
}
);
if (updated) {
updated = new Date(updated).toLocaleDateString(
"en-us",
{
year: "numeric",
month: "short",
day: "numeric",
}
);
}
---
<html lang="en-us">
@@ -28,13 +48,14 @@ const {
:
<span>{added && <time>{added}</time>}</span>
}
<Tags tags={tags} />
<hr />
<div class="blog-post">
<slot />
</div>
</article>
</main>
<Tags tags={tags} />
<Tags tags={allTags} all />
<Footer />
<ColorScript />
</body>

5
src/pages/index.astro
View File

@@ -22,10 +22,13 @@ const tags = getTags(posts);
<main>
<About />
<br />
<h3>Here's my most recent posts</h3>
<HomePosts allPosts={posts} />
<Tags tags={tags} />
<Tags tags={tags} all />
</main>
<Footer />
<ColorScript />

29
src/pages/post/[slug].astro
View File

@@ -12,33 +12,8 @@ export async function getStaticPaths() {
}
const { post } = Astro.props;
post.frontmatter.added = new Date(post.frontmatter.added).toLocaleDateString(
"en-us",
{
year: "numeric",
month: "short",
day: "numeric",
}
);
if (post.frontmatter.updated === "Invalid Date") {
post.frontmatter.updated = null;
} else {
post.frontmatter.updated = new Date(post.frontmatter.updated).toLocaleDateString(
"en-us",
{
year: "numeric",
month: "short",
day: "numeric",
}
);
}
const {
Content,
frontmatter: { title, added, updated, tags, excerpt },
} = post;
const { Content } = post;
---
<Content />

2
src/style/global.css
View File

@@ -222,7 +222,7 @@ article :not(.article-title) {
.article-title {
font-size: 2em;
margin: 0.25em 0 0;
margin: 0.25em 0;
}
.blog-post {