fixed responsive layout (again!)

andy-preston · Nov 15, 2024 · dfeaed8 · dfeaed8
1 parent 9f50dc9
commit dfeaed8
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 12 deletions.
diff --git a/style/_display.css b/style/_display.css
@@ -1,8 +1,3 @@
-body {
-    width: 95%;
-    margin-inline: auto;
-}
-
 p, time {
     margin-top: 1ex;
 }

diff --git a/style/_front-page.css b/style/_front-page.css
@@ -2,10 +2,6 @@ h1 span, p.tag-line span {
     display: inline-block;
 }
 
-.front-page h1 {
-    margin-top: 1em;
-}
-
 #cover-pic {
     margin-top: 1lh;
     margin-bottom: 1lh;

diff --git a/style/_section_article_aside.css b/style/_section_article_aside.css
@@ -1,10 +1,23 @@
+body {
+    margin-left: 3vw;
+    margin-right: 3vw;
+    margin-top: 10px;
+    margin-bottom: 10px;
+}
+
 section, header, footer {
     display: grid;
-    column-gap: 5em;
-    grid-template-columns: repeat(2, min(45vw, 70ch));
+    column-gap: 6vw;
     justify-self: center;
+    grid-template-columns: min(41vw, 70ch) min(41vw, 70ch);
+
+    @media (width < 1000px) {
+        grid-template-columns: min(94vw, 70ch);
+    }
+}
 
-    & h1, & time {
+@media (width >= 1000px) {
+    h1, time {
         grid-column: span 2;
     }
 }