From 5490d39b392e9314982037ed1eb34ba2c9a0a2c2 Mon Sep 17 00:00:00 2001
From: Kentai Radiquum <kentai.waah@gmail.com>
Date: Sat, 13 Jul 2024 19:10:24 +0500
Subject: [PATCH] refactor: fill screen with grid on category pages

---
 app/components/ReleaseSection/ReleaseSection.jsx | 2 +-
 app/home/[slug]/page.js                          | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/components/ReleaseSection/ReleaseSection.jsx b/app/components/ReleaseSection/ReleaseSection.jsx
index 8e9d628..a875f7d 100644
--- a/app/components/ReleaseSection/ReleaseSection.jsx
+++ b/app/components/ReleaseSection/ReleaseSection.jsx
@@ -10,7 +10,7 @@ export const ReleaseSection = (props) => {
         </h1>
       </div>
       <div className="m-4">
-        <div className="grid justify-center sm:grid-cols-[repeat(auto-fill,400px)] grid-cols-[100%] gap-2">
+        <div className="grid justify-center sm:grid-cols-[repeat(auto-fit,minmax(400px,1fr))] grid-cols-[100%] gap-2 min-w-full">
           {props.content.map((release) => {
             return (
               <div
diff --git a/app/home/[slug]/page.js b/app/home/[slug]/page.js
index b9d9019..e2c04ec 100644
--- a/app/home/[slug]/page.js
+++ b/app/home/[slug]/page.js
@@ -64,7 +64,7 @@ export default function HomeStatus({ params }) {
     );
 
   return (
-    <main className="flex flex-col pt-2 pb-16 sm:pt-4 sm:pb-0">
+    <main className="pt-2 pb-16 sm:pt-4 sm:pb-0">
       {content && (
         <ReleaseSection
           sectionTitle={SectionTitleMapping[params.slug]}