Merge pull request #15 from UnityMultiplayer/dev/v2.0

v2.0 Release

Author: CephalonCosmic

app.vue

@@ -2,39 +2,104 @@
     <div class="h-screen">
         <Navbar />
         <NuxtPage />
-        <FooterComp />
+        <FooterBar />
         <!--<div class="bg2 h-screen w-screen fixed top-0 left-0 -z-50"></div>-->
     </div>
 </template>
 
-<style lang="css">
-    
-</style>
+<style lang="scss">
+  body {
+    background-color: var(--bg-main);
+    color: var(--text-main);
+  }
+
+  main {
+    overflow-y: auto;
+  }
+
+  img {
+    -webkit-user-select: none;
+    -webkit-user-drag: none;
+    user-select: none;
+    -moz-user-select: none;
+  }
+
+  *::-webkit-scrollbar {
+    width: 0.6rem;
+  }
+
+  *::-webkit-scrollbar-track {
+    background-color: var(--text-buttons);
+    border-radius: 25px;
+  }
+
+  *::-webkit-scrollbar-thumb {
+    background-color: var(--text-title);
+    border-radius: 25px 0 0 25px;
+  }
+
+  /* Light mode */
+  :root {
+    --bg-main: var(-color-zinc-50);
+
+    --text-title: var(--color-zinc-950);
+    --text-shadow: rgba(255, 255, 255, 0.5);
+    --text-main: var(--color-zinc-900);
+    --button-background: var(--color-zinc-100);
+    --text-live: var(--color-rose-500);
+  }
 
-<style scoped>
-    .bg2 {
-        background-image: linear-gradient(45deg, var(--bg-gradient-color1), var(--bg-gradient-color2));
+  /* Dark mode */
+  @media (prefers-color-scheme: dark) {
+    :root {
+      --bg-main: var(--color-zinc-900);
+
+      --text-title: var(--color-zinc-50);
+      --text-shadow: rgba(0, 0, 0, 0.8);
+      --text-main: var(--color-zinc-100);
+      --button-background: var(--color-zinc-950);
+      --text-live: var(--color-rose-400);
     }
+  }
+
+  .unity-title {
+    color: var(--text-title);
+  }
+
+  .unity-bg {
+    background-color: var(--bg-main);
+  }
+
+  .unity-button {
+    background-color: var(--button-background);
+  }
 </style>
 
 <script setup lang="ts">
-    const route = useRoute();
-
-    useHead({
-        titleTemplate: '%s - Unity Multiplayer',
-        meta: [
-            {
-                property: 'og:title',
-                content: `${route.meta.name} - Unity Multiplayer`
-            },
-            {
-                property: 'twitter:title',
-                content: `${route.meta.name} - Unity Multiplayer`
-            },
-            {
-                property: 'title',
-                content: `${route.meta.name} - Unity Multiplayer`
-            }
-        ]
-    });
+  import Navbar from "~/components/navbar/Navbar.vue";
+  import FooterBar from "~/components/FooterBar.vue";
+
+  import '~/assets/fonts/Montserrat-Italic.ttf'
+  import '~/assets/fonts/Montserrat.ttf'
+  import '~/assets/fonts/Oswald.ttf'
+
+  const route = useRoute();
+
+  useHead({
+    titleTemplate: '%s - Unity Multiplayer',
+    meta: [
+      {
+        property: 'og:title',
+        content: `${route.meta.name} - Unity Multiplayer`
+      },
+      {
+        property: 'twitter:title',
+        content: `${route.meta.name} - Unity Multiplayer`
+      },
+      {
+        property: 'title',
+        content: `${route.meta.name} - Unity Multiplayer`
+      }
+    ]
+  });
 </script>

assets/css/index.css

@@ -0,0 +1,6 @@
+@import url('https://gists.rawgit.com/mfd/f3d96ec7f0e8f034cc22ea73b3797b59/raw/856f1dbb8d807aabceb80b6d4f94b464df461b3e/gotham.css');
+@import "tailwindcss";
+
+@theme {
+    --font-sans: GothamPro, Roboto, 'Segoe UI', sans-serif;
+}

assets/css/main.css

@@ -1,18 +1,30 @@
 {
     "emberhold": {
         "name": "Emberhold",
-        "color": "#e60631"
+        "color": "#F14C4C"
     },
     "suncrest": {
         "name": "Suncrest",
-        "color": "#fee63c"
+        "color": "#FFD152"
     },
     "fernfall": {
         "name": "Fernfall",
-        "color": "#8ce41a"
+        "color": "#26D167"
     },
-    "unity_team": {
-        "name": "Unity Team",
-        "color": "#2a91ff"
+    "unity_team:lead": {
+        "name": "Team Lead",
+        "color": "rgb(195, 122, 255)"
+    },
+    "unity_team:development": {
+        "name": "Development Branch",
+        "color": "rgb(102, 209, 255)"
+    },
+    "unity_team:creative": {
+        "name": "Creative Branch",
+        "color": "rgb(195, 239, 60)"
+    },
+    "unity_team:acting": {
+        "name": "Acting Branch",
+        "color": "rgb(255, 176, 46)"
     }
 }