Move tag posters and photos to media database.

assets/components/header/header.vue

@@ -13,7 +13,7 @@
                         class="nav-link"
                         :class="{ active: active === 'actors' }"
                     >
-                        <Icon icon="stars" />Actors
+                        <Icon icon="stars" /><span class="nav-label">Actors</span>
                     </router-link>
                 </li>
 
@@ -23,7 +23,7 @@
                         class="nav-link"
                         :class="{ active: active === 'networks' }"
                     >
-                        <Icon icon="earth2" />Networks
+                        <Icon icon="earth2" /><span class="nav-label">Networks</span>
                     </router-link>
                 </li>
 
@@ -33,7 +33,7 @@
                         class="nav-link"
                         :class="{ active: active === 'tags' }"
                     >
-                        <Icon icon="price-tags" />Tags
+                        <Icon icon="price-tags" /><span class="nav-label">Tags</span>
                     </router-link>
                 </li>
             </ul>
@@ -83,8 +83,9 @@ export default {
 }
 
 .nav-link {
-    display: inline-flex;
+    display: flex;
     align-items: center;
+    justify-content: center;
     padding: 1rem;
     border-bottom: solid 5px transparent;
     color: $shadow;
@@ -114,4 +115,24 @@ export default {
         }
     }
 }
+
+@media(max-width: $breakpoint0) {
+    .nav-label {
+        display: none;
+    }
+
+    .nav .nolist {
+        display: flex;
+    }
+
+    .nav,
+    .nav-item {
+        flex-grow: 1;
+    }
+
+    .nav-link {
+
+
+    }
+}
 </style>