From 5e6cf18108d32cdc0d7a07b5e157a882a7729a3e Mon Sep 17 00:00:00 2001
From: Kyren223 <Kyren223@proton.me>
Date: Fri, 3 Jan 2025 15:43:42 +0200
Subject: [PATCH] Fixed the blogs page for mobile

---
 src/components/BlogItem.astro | 2 +-
 src/pages/blogs.astro         | 8 +++++---
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/components/BlogItem.astro b/src/components/BlogItem.astro
index 6cff714..c61f62b 100644
--- a/src/components/BlogItem.astro
+++ b/src/components/BlogItem.astro
@@ -19,7 +19,7 @@ interface Props {
 const { title, description, date, href, header } = Astro.props;
 ---
 
-<TerminalBorder header={header} footer={formatDate(date)} extra="mb-[2vw]">
+<TerminalBorder header={header} footer={formatDate(date)} extra="mb-[5vw] sm:mb-[2vw]">
     <span class="cursor-pointer group block w-full">
         {
             href ? (
diff --git a/src/pages/blogs.astro b/src/pages/blogs.astro
index 45089f6..84cca84 100644
--- a/src/pages/blogs.astro
+++ b/src/pages/blogs.astro
@@ -14,14 +14,16 @@ const blogs = (await getCollection("blogs"))
     }));
 const repeatArray = (arr, times) => Array(times).fill(arr).flat();
 const repeated = repeatArray(blogs, 10);
-
 ---
 
 <Terminal path="blogs/">
-    <TerminalBorder header="Shell" extra="sm:mt-[0.625vw] sm:mb-[1.5625vw]">
+    <TerminalBorder
+        header="Shell"
+        extra="mb-[5vw] sm:mt-[0.625vw] sm:mb-[1.5625vw]"
+    >
         <p>$ ls -lah -t --color=auto ~/blogs</p>
     </TerminalBorder>
-    <div class="sm:max-h-[24vw] overflow-y-auto">
+    <div class="max-h-[80svh] sm:max-h-[24vw] overflow-y-auto">
         {
             repeated.map((blog) => (
                 <>