Update footer, make it mobile friendly

frontend-new/src/components/layout/Footer.vue

@@ -2,12 +2,15 @@
   <footer class="relative flex items-end mt-10 bg-[#ecf2fb] dark:bg-[#212121] px-8 pb-2 text-light-10 min-h-10">
     <div class="footerContent w-screen">
       <div class="footerBar flex items-center justify-around mt-4 max-w-1200px m-auto text-sm">
-        <p>Copyright © <a href="https://papermc.io/">PaperMC</a> 2016 - 2022</p>
-        <div class="footerBarLinks flex">
-          <router-link :to="{ name: 'staff' }" class="flex items-center rounded-md px-6 py-2" hover="text-primary-400 bg-primary-0">About Hangar </router-link>
-          <router-link :to="{ name: 'staff' }" class="flex items-center rounded-md px-6 py-2" hover="text-primary-400 bg-primary-0">Imprint </router-link>
-          <router-link :to="{ name: 'staff' }" class="flex items-center rounded-md px-6 py-2" hover="text-primary-400 bg-primary-0"
-            >Privacy Policy
+        <p>© 2022 <a href="https://papermc.io/">PaperMC</a></p>
+        <div class="footerBarLinks flex flex-col md:flex-row">
+          <router-link :to="{ name: 'guidelines' }" class="flex items-center rounded-md px-6 py-2" hover="text-primary-400 bg-primary-0"
+            >Resource Guidelines
+          </router-link>
+          <router-link :to="{ name: 'api' }" class="flex items-center rounded-md px-6 py-2" hover="text-primary-400 bg-primary-0">API </router-link>
+          <a href="https://github.com/HangarMC" class="flex items-center rounded-md px-6 py-2" hover="text-primary-400 bg-primary-0">GitHub Organization </a>
+          <router-link :to="{ name: 'tos' }" class="flex items-center rounded-md px-6 py-2" hover="text-primary-400 bg-primary-0"
+            >Terms of Service
           </router-link>
         </div>
       </div>

frontend-new/src/components/layout/Header.vue

@@ -17,6 +17,7 @@ import IconMdiLanguageJava from "~icons/mdi/language-java";
 import IconMdiPuzzle from "~icons/mdi/puzzle";
 import IconMdiDownloadCircle from "~icons/mdi/download-circle";
 import IconMdiKey from "~icons/mdi/key";
+import IconMdiFileCodumentAlert from "~icons/mdi/file-document-alert";
 
 import { useAuthStore } from "~/store/auth";
 import { useAuth } from "~/composables/useAuth";
@@ -32,14 +33,15 @@ const backendData = useBackendDataStore();
 
 const navBarLinks = [
   { link: "index", label: "Home" },
-  { link: "staff", label: "Team" },
   { link: "authors", label: "Authors" },
+  { link: "staff", label: "Team" },
 ];
 
 const navBarMenuLinksHangar = [
   { link: "index", label: "Home", icon: IconMdiHome },
-  { link: "staff", label: "Team", icon: IconMdiAccountGroup },
+  { link: "guidelines", label: "Resource Guidelines", icon: IconMdiFileCodumentAlert },
   { link: "authors", label: "Authors", icon: IconMdiAccountGroup },
+  { link: "staff", label: "Team", icon: IconMdiAccountGroup },
 ];
 
 const navBarMenuLinksMoreFromPaper = [

frontend-new/src/i18n/locales/en.json

@@ -46,6 +46,7 @@
     "sponsoredBy": "Sponsored by"
   },
   "pages": {
+    "guidelinesTitle": "Resource Guidelines",
     "staffTitle": "Staff",
     "authorsTitle": "Authors",
     "headers": {
@@ -98,6 +99,9 @@
       "auth": "Authentication Portal"
     }
   },
+  "guidelines": {
+    "title": "Resource Guidelines"
+  },
   "project": {
     "stargazers": "Stargazers",
     "noStargazers": "There are no stargazers on this project yet 😢",

frontend-new/src/pages/guidelines.vue

@@ -0,0 +1,16 @@
+<script lang="ts" setup>
+import { useI18n } from "vue-i18n";
+import { useRoute } from "vue-router";
+import PageTitle from "~/components/design/PageTitle.vue";
+import { useSeo } from "~/composables/useSeo";
+import { useHead } from "@vueuse/head";
+
+const i18n = useI18n();
+const route = useRoute();
+
+useHead(useSeo(i18n.t("pages.guidelinesTitle"), null, route, null));
+</script>
+
+<template>
+  <PageTitle>{{ i18n.t("guidelines.title") }}</PageTitle>
+</template>

frontend-new/src/pages/tos.vue

@@ -0,0 +1,5 @@
+<script lang="ts" setup></script>
+
+<template>
+  <PageTitle>Terms of Service</PageTitle>
+</template>