chore: polish layout and homepage lists

src/pages/index.astro

@@ -4,6 +4,7 @@ import BlogPost from "../components/BlogPost.astro";
 import { getCollection } from "astro:content";
 const pageTitle = "Naputo";
 const allPosts = await getCollection("blog");
+const sortedPosts = allPosts.sort((a, b) => b.data.pubDate.valueOf() - a.data.pubDate.valueOf());
 ---
 
 <style>
@@ -41,7 +42,7 @@ const allPosts = await getCollection("blog");
 	<h3 class="header-new-posts">New Posts</h3>
 	<div class="new-articles">
 		{
-			allPosts.slice(0, 6).map((post: any) => (
+			sortedPosts.slice(0, 5).map((post: any) => (
 				<BlogPost
 					url={`/posts/${post.id}/`}
 					title={post.data.title}