X-Git-Url: https://code.kerkeslager.com/?p=txt.house;a=blobdiff_plain;f=txt_house%2Ftemplates%2Fbase.html;h=547aeef4da79e1bdb929698281b4896d7008d118;hp=a9fb172a8958b7ee6060290ac1b2d202b5bf3c4a;hb=a837b232717e170ffcf2361ea0c7a8c745ca3b53;hpb=9b232a209ae57cea33a0156a5c4cac7e72edda8f

diff --git a/txt_house/templates/base.html b/txt_house/templates/base.html
index a9fb172..547aeef 100644
--- a/txt_house/templates/base.html
+++ b/txt_house/templates/base.html
@@ -31,12 +31,26 @@
         max-width: 40rem;
       }
 
+      @media only screen and (max-width: 30rem) {
+        body {
+          margin: 0 2rem;
+          width: calc(100% - 4rem);
+        }
+      }
+
+      @media only screen and (max-width: 20rem) {
+        body {
+          margin: 0 1rem;
+          width: calc(100% - 2rem);
+        }
+      }
+
       nav {
         display: flex;
         flex-direction: row;
         align-items: center;
 
-        width: 40rem;
+        width: 100%;
         height: 5rem;
       }
 
@@ -51,6 +65,10 @@
         color: black;
       }
 
+      nav a:hover {
+        text-decoration-thickness: 2px;
+      }
+
       nav label {
         margin-right: 0.2rem;
       }
@@ -70,7 +88,19 @@
         align-items: center;
       }
 
-      form.editor span {
+      nav + form.editor {
+        margin-top: 2.2rem;
+      }
+
+      form.editor div.edit-key-area {
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        margin-bottom: 3.6rem;
+      }
+
+      form.editor span.field {
         display: flex;
         flex-direction: row;
         align-items: center;