Fix for mobile.

thesoftwarephilosopher · Aug 17, 2024 · 39acc5c · 39acc5c
1 parent 0290003
commit 39acc5c
Showing 1 changed file with 16 additions and 3 deletions.
diff --git a/site/style.css b/site/style.css
@@ -6,6 +6,7 @@ body {
 
 #root {
   max-width: 50em;
+  width: 80vw;
   margin: 3em auto 30em;
 }
 
@@ -66,10 +67,14 @@ a:hover {
 
 .sample {
   display: flex;
-  flex-wrap: wrap;
+  flex-direction: column;
   gap: 1em;
 }
 
+.sample-code {
+  overflow: auto;
+}
+
 .sample p {
   margin-top: 0;
 }
@@ -87,8 +92,16 @@ a:hover {
   flex: 1 0 auto;
 }
 
-.sample-output {
-  flex: 0 0 14em;
+@media (min-width: 600px) {
+
+  .sample {
+    flex-direction: row;
+  }
+
+  .sample-output {
+    flex: 0 0 14em;
+  }
+
 }
 
 button,