formatting and layout

src/pages/blog/index.astro

@@ -22,19 +22,11 @@ const postsByYear = sortedPosts.reduce((acc, post) => {
 }, {});
 
 const years = Object.keys(postsByYear).sort((a, b) => b - a);
-
-// Get total post count
-const totalPosts = sortedPosts.length;
-
-// Get unique tags for search suggestions
-const allTags = [...new Set(sortedPosts.flatMap((post) => post.tags || []))];
 ---
 
 <BaseLayout title="Blog">
   <div class="mx-auto w-full max-w-6xl px-4 py-10 sm:px-6 sm:py-16">
-    <!-- Header with search  -->
     <div class="relative mb-12 sm:mb-20">
-      <!-- Decorative elements -->
       <div
         class="animate-blob absolute -top-10 -left-10 h-48 w-48 rounded-full bg-zinc-100 opacity-30 blur-3xl sm:-top-20 sm:-left-20 sm:h-72 sm:w-72 dark:bg-zinc-800/30"
       >
@@ -124,7 +116,7 @@ const allTags = [...new Set(sortedPosts.flatMap((post) => post.tags || []))];
         )
       }
 
-      <!-- Improved sidebar for mobile -->
+      <!-- Sidebar for mobile -->
       <div class="relative md:col-span-3">
         <div class="mb-8 space-y-4 md:sticky md:top-24 md:mb-0">
           <h3
@@ -156,7 +148,7 @@ const allTags = [...new Set(sortedPosts.flatMap((post) => post.tags || []))];
         </div>
       </div>
 
-      <!-- Improved post grid for mobile -->
+      <!-- Post grid for mobile -->
       <div class="md:col-span-9">
         {
           years.map((year) => (
@@ -168,7 +160,7 @@ const allTags = [...new Set(sortedPosts.flatMap((post) => post.tags || []))];
               <div
                 class={`grid grid-cols-1 ${postsByYear[year].length >= 2 ? 'md:grid-cols-2' : 'md:grid-cols-1'} gap-8 sm:gap-12`}
               >
-                {postsByYear[year].map((post, index) => (
+                {postsByYear[year].map((post) => (
                   <article class="group relative mx-auto flex h-full w-full max-w-sm flex-col sm:max-w-md md:mx-0">
                     {post.image && (
                       <div class="mb-4 h-48 overflow-hidden rounded-lg sm:h-56">
@@ -303,7 +295,7 @@ const allTags = [...new Set(sortedPosts.flatMap((post) => post.tags || []))];
     overflow: hidden;
   }
 
-  /* Improved touch targets for mobile */
+  /* Touch targets for mobile */
   @media (max-width: 640px) {
     a,
     button {
@@ -315,7 +307,6 @@ const allTags = [...new Set(sortedPosts.flatMap((post) => post.tags || []))];
 </style>
 
 <script>
-  // Script không thay đổi - giữ nguyên chức năng
   document.addEventListener('DOMContentLoaded', () => {
     const backToTopButton = document.getElementById('back-to-top');
 
@@ -341,7 +332,7 @@ const allTags = [...new Set(sortedPosts.flatMap((post) => post.tags || []))];
 
       // Check scroll position
       window.addEventListener('scroll', toggleBackToTopButton);
-      toggleBackToTopButton(); // Initial check
+      toggleBackToTopButton();
     }
 
     // Add smooth scrolling to year links