Improve some designs

src/pages/blog.astro

@@ -7,13 +7,26 @@ const allPosts = await getCollection("blog");
 const pageTitle = "新着記事";
 ---
 
+<style>
+	.list-articles {
+		text-align: start;
+		margin-bottom: 2rem;
+	}
+</style>
 <BaseLayout pageTitle={pageTitle}>
-	<p>This is where I will post about my journey learning Astro.</p>
+	<div class="list-articles">
-	<ul>
 		{
 			allPosts.map((post: any) => (
-				<BlogPost url={`/posts/${post.id}/`} title={post.data.title} />
+				<BlogPost
+					url={`/posts/${post.id}/`}
+					title={post.data.title}
+					datetime={post.data.pubDate.toLocaleDateString("ja-JP", {
+						year: "numeric",
+						month: "2-digit",
+						day: "2-digit",
+					})}
+				/>
 			))
 		}
-	</ul>
+	</div>
 </BaseLayout>

src/pages/index.astro

@@ -29,7 +29,7 @@ const allPosts = await getCollection("blog");
 </style>
 <BaseLayout pageTitle={pageTitle}>
 	<h2>20代のエンジニアによる技術や書評のアウトプットブログ</h2>
-	<h3 class="header-new-posts">新しい記事 一覧</h3>
+	<h3 class="header-new-posts">新しい記事</h3>
 	<div class="new-articles">
 		{
 			allPosts.slice(0, 6).map((post: any) => (