From 1a8c28c544116f7edbfe5631a41f9f723a97304f Mon Sep 17 00:00:00 2001
From: nam <namish@tuta.io>
Date: Sat, 26 Oct 2024 17:27:22 +0530
Subject: [PATCH] blog and poem list

---
 src/components/List.astro   | 10 +++++-----
 src/pages/blog/index.astro  |  4 ++--
 src/pages/poems/index.astro |  4 ++--
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/components/List.astro b/src/components/List.astro
index 7861a1c..1ef9d6b 100644
--- a/src/components/List.astro
+++ b/src/components/List.astro
@@ -11,9 +11,9 @@ const { posts, l } = Astro.props;
                     href={href}
                     class="cursor-pointer gap-3 flex flex-col items-start"
                 >
-                    <div class="lg:px-0 lg:py-2 md:px-12 px-8 py-4 flex flex-col items-start">
+                    <div class="lg:px-0 lg:py-2 md:px-12 px-4 py-4 flex flex-col items-start">
                         <div class="flex sm:flex-row flex-col  gap-0 justify-center sm:gap-4">
-                            <h2 class="text-xl sm:text-2xl font-bold text-fg mt-4 mb-4">
+                            <h2 class="text-lg md:text-xl sm:text-2xl font-bold text-fg mt-4 md:mb-4 mb-2">
                                 <span class="font-sans mr-1 md:mr-2 font-bold text-primary">
                                     {index + 1}.
                                 </span>
@@ -21,15 +21,15 @@ const { posts, l } = Astro.props;
                             </h2>
 
                             <div class="flex items-center sm:mb-0 mb-4 gap-2 md:gap-4">
-                                <div class="p-1 font-mono font-light bg-mbg rounded-md text-fg">
+                                <div class="p-1 font-mono font-light text-sm md:text-lg bg-mbg rounded-md text-fg">
                                     {post.frontmatter.category}
                                 </div>
-                                <p class="leading-relaxed flex-end text-md text-fg">
+                                <p class="leading-relaxed flex-end text-sm md:text-lg text-fg">
                                     {post.frontmatter.date}
                                 </p>
                             </div>
                         </div>
-                        <p class="leading-relaxed  mb-4 text-lg text-bright">
+                        <p class="leading-relaxed  mb-4 text-sm md:text-lg text-bright">
                             {post.frontmatter.description}
                         </p>
                     </div>
diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro
index 3c58243..ac119d4 100644
--- a/src/pages/blog/index.astro
+++ b/src/pages/blog/index.astro
@@ -30,10 +30,10 @@ let keys = Object.keys(postsByYear).reverse();
                             keys.map((i) => {
                                 return (
                                     <div>
-                                        <h1 class="lg:px-0 px-8 text-2xl md:text-5xl font-bold text-fg">
+                                        <h1 class="lg:px-0 md:px-8 px-4 text-2xl md:text-5xl font-bold text-fg">
                                             {i}
                                         </h1>
-                                        <div class="lg:px-0 px-8">
+                                        <div class="lg:px-0 px-4 md:px-8">
                                             <div class="mt-3 h-[2px] px-32 bg-bg3 inline-block" />
                                         </div>
                                         <List posts={postsByYear[i]} l="blog" />
diff --git a/src/pages/poems/index.astro b/src/pages/poems/index.astro
index 63e04ba..751fdb0 100644
--- a/src/pages/poems/index.astro
+++ b/src/pages/poems/index.astro
@@ -30,10 +30,10 @@ let keys = Object.keys(postsByYear).reverse();
                             keys.map((i) => {
                                 return (
                                     <div>
-                                        <h1 class="lg:px-0 px-8 text-3xl md:text-5xl font-bold text-fg">
+                                      <h1 class="lg:px-0 md:px-8 px-4 text-2xl md:text-5xl font-bold text-fg">
                                             {i}
                                         </h1>
-                                        <div class="lg:px-0 px-8">
+                                        <div class="lg:px-0 px-4 md:px-8">
                                             <div class="mt-3 h-[2px] px-32 bg-bg3 inline-block" />
                                         </div>
                                         <List