Showing compact logo on narrow screens.

assets/components/header/header.vue

@@ -4,7 +4,16 @@
             <router-link
                 to="/home"
                 class="logo-link"
-            ><h1 class="logo"><Icon icon="logo" /></h1></router-link>
+            ><h1 class="logo">
+                <Icon
+                    icon="logo"
+                />
+
+                <Icon
+                    icon="logo_t"
+                    class="logo-compact"
+                />
+            </h1></router-link>
 
             <nav class="nav">
                 <ul class="nolist">
@@ -126,6 +135,10 @@ export default {
         width: 6rem;
         height: 1.5rem;
     }
+
+    .logo-compact {
+        display: none;
+    }
 }
 
 .nav {
@@ -209,7 +222,16 @@ export default {
     }
 
     .logo {
-        display: none;
+        margin: 0;
+
+        .icon {
+            display: none;
+        }
+
+        .icon.logo-compact {
+            width: 1.5rem;
+            display: inline-block;
+        }
     }
 }
 </style>