From ec584b33894c53399ede3779d81b8d35e59d0571 Mon Sep 17 00:00:00 2001
From: joshuamotoaki <dachshunduniverse@gmail.com>
Date: Thu, 7 Nov 2024 20:03:30 -0500
Subject: [PATCH] Use Claude's suggestion on layout

---
 src/layouts/Layout.astro | 32 +++++++++++++++++++-------------
 1 file changed, 19 insertions(+), 13 deletions(-)

diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 3bf1ed1..dca933c 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -84,34 +84,40 @@ import { AstroSeo } from "@astrolib/seo";
     .app-grid {
         display: grid;
         gap: 2rem;
-
+        grid-template-columns: 1fr; 
+        
         article {
-            grid-column: span 2;
+            width: 100%;
         }
-
-        @media (min-width: 768px) {
-            grid-template-columns: repeat(4, 1fr);
-
+        
+        @media screen and (min-width: 768px) {
+            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+            max-width: 100%;
+            
+            article {
+                grid-column: span 2;
+            }
+            
             article:last-child:nth-child(2n - 1) {
                 grid-column-end: -2;
             }
         }
-
-        @media (min-width: 1280px) {
+        
+        @media screen and (min-width: 1280px) {
             grid-template-columns: repeat(6, 1fr);
-
+            
             article:last-child:nth-child(2n - 1) {
-                grid-column-end: auto
+                grid-column-end: auto;
             }
-
+            
             article:last-child:nth-child(3n - 1) {
                 grid-column-end: -2;
             }
-
+            
             article:nth-last-child(2):nth-child(3n + 1) {
                 grid-column-end: 4;
             }
-
+            
             article:last-child:nth-child(3n - 2) {
                 grid-column-end: 5;
             }