feat(frontend): supports more links in header

1 files changed, 22 insertions, 13 deletions

diff --git a/frontend/scss/special.scss b/frontend/scss/special.scss
index bee2ecb..d0e9ee9 100644
--- a/frontend/scss/special.scss
+++ b/frontend/scss/special.scss
@@ -12,20 +12,8 @@ header {
 
   border-bottom: var(--color-light) 2px solid;
 
-  @media only screen and (max-width: 600px) {
-    flex-direction: column;
-    align-items: normal;
-
-    height: auto;
-    min-height: var(--height-header);
-    & img {
-      width: max(33%, 128px);
-      margin: 0 auto;
-    }
-  }
-
   & img {
-    height: 100%;
+    height: var(--height-header);
   }
 
   & nav {
@@ -44,6 +32,27 @@ header {
       font-family: monospace;
     }
   }
+  @media only screen and (max-width: 800px) {
+    height: 12rem;
+    padding-bottom: 0;
+    align-items: start;
+  }
+
+  @media only screen and (max-width: 600px) {
+    flex-direction: column;
+    align-items: normal;
+
+    height: auto;
+    min-height: var(--height-header);
+
+    padding-bottom: 2rem;
+
+    & img {
+      height: 100%;
+      width: max(33%, 128px);
+      margin: 0 auto;
+    }
+  }
 }
 
 footer {