fix: add better handling for mobile formatting

hugo.toml

@@ -28,15 +28,10 @@ name = 'writing'
 pageRef = '/writing'
 weight = 50
 
-[[menus.main]]
-name = 'music'
-pageRef = '/music'
-weight = 60
-
 [[menus.main]]
 name = 'links'
 pageRef = '/links'
-weight = 70
+weight = 60
 
 enableGitInfo = true
 

themes/aviary/assets/css/main.scss

@@ -2,13 +2,15 @@
 
 html {
     background: #238e23;
+    display: flex;
+    justify-content: center;
 }
 
 body {
     color: #151515;
     font-family: 'Assistant', sans-serif;
     line-height: 1.5;
-    margin: 1rem auto;
+    margin: 0.666rem;
     max-width: 666px;
     padding: 1rem;
     border: 0.420rem solid #b68024;
@@ -17,11 +19,31 @@ body {
 }
 
 header {
-    border-bottom: 1px solid #222;
+    display: flex;
-    margin-bottom: 1rem;
+    flex-direction: column;
     h1 {
         color: #ee871c;
     }
+    nav {
+        max-width: 80vw;
+        align-self: center;
+        ul {
+            display: flex;
+            flex-direction: row;
+            list-style-type: none;
+            justify-content: center;
+            align-items: center;
+            margin: 0;
+            padding: 0;
+            li {
+                padding: 0.1rem;
+            }
+            li .active {
+                text-decoration: underline;
+            }
+            overflow-x: scroll;
+        }
+    }
 }
 
 footer {
@@ -38,34 +60,24 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 a {
-    color: #00e;
+    color: #238e23;
     text-decoration: none;
 }
 
 main {
     max-width: 666px;
-    overflow-x: scroll;
 }
 
 img {
     max-width: 100%;
 }
 
-nav {
+
-    ul {
+table {
-        display: flex;
+    max-width: 80vw;
-        flex-direction: row;
+    display: block;
-        list-style-type: none;
+    overflow-x: auto;
-        justify-content: center;
+    white-space: nowrap;
-        margin: 0;
-        padding: 0;
-        li {
-            margin: 1rem;
-        }
-        li .active {
-            text-decoration: underline;
-        }
-    }
 }
 
 figure {

themes/aviary/layouts/partials/footer.html

@@ -20,12 +20,14 @@
             >CC BY-NC 4.0</a
         >
     </p>
-        <p>
+</small>
-            &nbsp; &#45; this website is
+<small>
-            <a
+    <p>
-                href="https://git.tacowolf.net/TacoWolf/birdcat.online"
+        this website is
-                target="_blank"
+        <a
-                >open source</a
+            href="https://git.tacowolf.net/TacoWolf/birdcat.online"
-            >
+            target="_blank"
-        </p>
+            >open source</a
+        >
+    </p>
 </small>