From 4ba339984d239180a526a5ae8ffbb558f1b5642a Mon Sep 17 00:00:00 2001
From: Valentin Popov <valentin@popov.link>
Date: Thu, 12 Sep 2024 13:11:16 +0000
Subject: Updated the main page and page structures

---
 src/pages/blog/[...slug].astro | 34 +++++++++++++++++++++-------------
 src/pages/index.astro          | 13 ++++---------
 2 files changed, 25 insertions(+), 22 deletions(-)

(limited to 'src/pages')

diff --git a/src/pages/blog/[...slug].astro b/src/pages/blog/[...slug].astro
index f99ef21..4ecb1e1 100644
--- a/src/pages/blog/[...slug].astro
+++ b/src/pages/blog/[...slug].astro
@@ -23,17 +23,25 @@ const { Content, remarkPluginFrontmatter } = await post.render();
 </style>
 
 <Layout title={post.data.title} description={post.data.description}>
-	<div class="header">
-		<h1>{post.data.title}</h1>
-		<p>
-			<small>
-				Posted
-				<time datetime={post.data.pubDate.toISOString()}>{post.data.pubDate.toDateString()}</time>
-				&nbsp;by&nbsp;{post.data.author}&nbsp;‐
-				<strong>{remarkPluginFrontmatter.minutesRead}</strong>
-			</small>
-		</p>
-	</div>
-	<Content />
-	<Comments />
+	<article>
+		<section class="header">
+			<h1>{post.data.title}</h1>
+			<p>
+				<small>
+					Posted
+					<time datetime={post.data.pubDate.toISOString()}>{post.data.pubDate.toDateString()}</time>
+					&nbsp;by&nbsp;{post.data.author}&nbsp;‐
+					<strong>{remarkPluginFrontmatter.minutesRead}</strong>
+				</small>
+			</p>
+		</section>
+
+		<section>
+			<Content />
+		</section>
+
+		<section>
+			<Comments />
+		</section>
+	</article>
 </Layout>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index c4f5577..4380bbc 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,18 +1,13 @@
 ---
 import { getCollection } from "astro:content";
+import Element from "../components/PostElement.astro";
 import Layout from "../layouts/PageLayout.astro";
 
 const posts = await getCollection("blog");
 ---
 
 <Layout>
-	<ul>
-		{
-			posts.map((post) => (
-				<li>
-					<a href={`/blog/${post.slug}`}>{post.data.title}</a>
-				</li>
-			))
-		}
-	</ul>
+	<section>
+		{posts.map((post) => <Element post={post} />)}
+	</section>
 </Layout>
-- 
cgit v1.2.3