Add some text and styling

[txt.house] / txt_house / templates / base.html

diff --git a/txt_house/templates/base.html b/txt_house/templates/base.html
index a9fb172..547aeef 100644 (file)
--- 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;