Full mobile support

components/ModPage.vue

@@ -219,7 +219,6 @@ export default {
 .mod-navigation {
   display: flex;
   margin-top: 20px;
-  overflow-y: auto;
 
   a {
     user-select: none;
@@ -380,4 +379,25 @@ export default {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+
+@media screen and (max-width: 550px) {
+  .title a {
+    display: none;
+  }
+}
+
+@media screen and (max-width: 800px) {
+  .mod-navigation {
+    display: block;
+    overflow-x: auto;
+    overflow-wrap: break-word;
+    overflow-y: hidden;
+  }
+}
+
+@media screen and (max-width: 1400px) {
+  .mod-info {
+    display: none;
+  }
+}
 </style>

pages/dashboard/projects.vue

@@ -158,4 +158,31 @@ table {
     }
   }
 }
+
+@media screen and (max-width: 550px) {
+  th,
+  td {
+    &:nth-child(1) {
+      img {
+        height: 2rem;
+        width: 2rem;
+      }
+    }
+    &:nth-child(3) {
+      display: none;
+    }
+  }
+}
+
+@media screen and (max-width: 850px) {
+  th,
+  td {
+    &:nth-child(2) {
+      width: 25% !important;
+    }
+    &:nth-child(6) {
+      display: none;
+    }
+  }
+}
 </style>

pages/mod/_id/versions.vue

@@ -495,4 +495,40 @@ input {
   border-left: #e04e3e 7px solid;
   padding: 5px 20px 20px 20px;
 }
+
+@media screen and (max-width: 400px) {
+  th,
+  td {
+    &:nth-child(7) {
+      display: none;
+    }
+  }
+}
+
+@media screen and (max-width: 600px) {
+  th,
+  td {
+    &:nth-child(8) {
+      display: none;
+    }
+  }
+}
+
+@media screen and (max-width: 800px) {
+  th,
+  td {
+    &:nth-child(5) {
+      display: none;
+    }
+  }
+}
+
+@media screen and (max-width: 1000px) {
+  th,
+  td {
+    &:nth-child(2) {
+      display: none;
+    }
+  }
+}
 </style>