chchchchch changez

src/pages/blog/index.astro

@@ -4,10 +4,10 @@ import BlogPostList from "~/components/lists/BlogPostList.astro";
 ---
 
 <Page
-  title="Post index"
+  title="Blog thing yes yes"
   description="A list of all my blog posts."
-  icon="fa-solid fa-blog"
+  icon="fa-solid fa-star"
 >
-  
+  <p class="mb-6">my personal blog is <a class="link" href="https://concorde.blog">Concorde</a>, but here has more technical things.</p>
   <BlogPostList collection="blog" />
 </Page>

src/pages/blog/tags/[tag].astro

@@ -0,0 +1,44 @@
+---
+import { getCollection } from "astro:content";
+import Page from "~/layouts/Page.astro"
+import Date from "~/components/util/Date.astro";
+import StyledLink from "~/components/util/StyledLink.astro";
+export async function getStaticPaths() {
+	const allPosts = await getCollection("blog");
+	const uniqueTags = [
+		...new Set(allPosts.map((post) => post.data.tags).flat()),
+	];
+
+	return uniqueTags.map((tag) => {
+		const filteredPosts = allPosts.filter((post) =>
+			post.data.tags.includes(tag)
+		);
+		return {
+			params: { tag },
+			props: { posts: filteredPosts },
+		};
+	});
+}
+
+const { tag } = Astro.params;
+const { posts } = Astro.props;
+---
+
+<Page title={`Posts tagged with #${tag}`} icon="fa-solid fa-tag">
+	<StyledLink href="/blog/tags" icon="fa-solid fa-arrow-left">
+		See some more tags....
+	</StyledLink>	
+	<ul class="fa-ul">
+		{
+			posts.map((post) => (
+				<li>
+                    <i class={`fa-li ${post.data.icon} text-light-pu dark:text-dark-pu`}></i>
+                    <a href={`/blog/${post.id}`}>{post.data.title}</a>
+					<span class="text-sm text-light-tx-2 dark:text-dark-tx-2">
+						(<Date date={post.data.date} />)
+					</span>
+                </li>
+			))
+		}
+	</ul>
+</Page>

src/pages/blog/tags/index.astro

@@ -6,12 +6,15 @@ const allPosts = await getCollection("blog");
 const tags = [...new Set(allPosts.map((post) => post.data.tags).flat())];
 ---
 
-<Layout title="Tags" description="">
+<Layout title="Tags" description="all the tags i've used, and probably some spelling mistakes" icon="fa-solid fa-tags">
     <ul class="fa-ul">
         {
             tags.map((tag) => <li>
-                <i class="fa-li fa-solid fa-hashtag"></i>
+                <i class="fa-li fa-solid fa-hashtag text-light-pu dark:text-dark-pu"></i>
                 <a href={`/blog/tags/${tag}`}>{tag}</a>
+                <span class="text-sm text-light-tx-2 dark:text-dark-tx-2">
+                    ({allPosts.filter((post) => post.data.tags.includes(tag)).length})
+                </span>
             </li>)
         }
     </ul>