From 1f46c091dd4f2e1c2e58f658544a68656fb056e7 Mon Sep 17 00:00:00 2001
From: Carson Fleming <cflems@cflems.net>
Date: Sat, 21 Oct 2023 00:28:24 -0400
Subject: Make styles responsive for small screens

---
 static/css/mobile.css | 39 ++++++++++++++++++++++++++++++++++++++-
 1 file changed, 38 insertions(+), 1 deletion(-)

(limited to 'static/css/mobile.css')

diff --git a/static/css/mobile.css b/static/css/mobile.css
index 364d400..7b73764 100644
--- a/static/css/mobile.css
+++ b/static/css/mobile.css
@@ -1,3 +1,40 @@
 @media screen and (max-width: 700px) {
-
+    body {
+        margin: 0;
+        min-height: 100vh;
+        width: 100vw;
+    }
+    #header {
+        justify-content: center;
+    }
+    #header #logo {
+        flex-grow: unset;
+    }
+    #content {
+        flex-direction: column;
+        align-items: center;
+    }
+    #content #lhs {
+        margin: 0 0.5rem 1rem;
+        font-size: 20pt;
+    }
+    #base-url {
+        font-size: 20pt;
+    }
+    #slug {
+        flex-grow: 1;
+    }
+    .form-element input, .form-element button {
+        font-size: 18pt;
+    }
+    #content #rhs {
+        margin: 1.5rem;
+    }
+    #content #rhs h3 {
+        font-size: 2em;
+    }
+    #content #rhs p {
+        font-size: 1.5em;
+        margin-bottom: 1rem;
+    }
 }
-- 
cgit v1.2.3