Switch to vertical layout for the logos on narrow screens

sourcebots · Aug 4, 2024 · 4feb06b · 4feb06b
1 parent 9054de4
commit 4feb06b
Showing 1 changed file with 14 additions and 2 deletions.
diff --git a/src/index.scss b/src/index.scss
@@ -43,9 +43,13 @@ header {
 
 section#logos {
     display: grid;
-    grid-template-columns: 1fr 1fr 1fr;
+
+    grid-auto-flow: column;
+    grid-auto-columns: 1fr;
+    grid-auto-rows: 1fr;
+
     align-items: center;
-    column-gap: 1rem;
+    gap: 1rem;
 
     img {
         display: block;
@@ -57,6 +61,14 @@ section#logos {
             height: 75px;
         }
     }
+
+    @media (width < 600px) {
+        grid-auto-flow: row;
+
+        img {
+            max-height: 8vh;
+        }
+    }
 }
 
 section {