From 5f95b92e9f6e7ba5ed23e683a04ae0033eef55fb Mon Sep 17 00:00:00 2001
From: Nikita Krupin <krupin.nikita0110@gmail.com>
Date: Tue, 4 Jan 2022 18:35:19 -0500
Subject: [PATCH] added proper page transition for API docs, chrome scrollbar
 hover, removed jank from background illustration

---
 Website/layouts/default.vue                   | 12 +++++--
 Website/package-lock.json                     | 33 -------------------
 Website/pages/debug.vue                       |  3 ++
 Website/pages/{documentation.vue => docs.vue} | 17 +++++++---
 .../{documentation => docs}/endpoints.vue     |  0
 .../{documentation => docs}/fetching.vue      |  0
 .../pages/{documentation => docs}/index.vue   |  0
 Website/pages/{documentation => docs}/url.vue |  0
 .../{documentation => docs}/usage-rights.vue  |  0
 Website/pages/donate.vue                      |  2 +-
 Website/pages/faq.vue                         |  2 +-
 Website/pages/help.vue                        |  2 +-
 Website/pages/index.vue                       |  2 +-
 Website/pages/install.vue                     |  2 +-
 Website/pages/links.vue                       |  2 +-
 15 files changed, 31 insertions(+), 46 deletions(-)
 rename Website/pages/{documentation.vue => docs.vue} (73%)
 rename Website/pages/{documentation => docs}/endpoints.vue (100%)
 rename Website/pages/{documentation => docs}/fetching.vue (100%)
 rename Website/pages/{documentation => docs}/index.vue (100%)
 rename Website/pages/{documentation => docs}/url.vue (100%)
 rename Website/pages/{documentation => docs}/usage-rights.vue (100%)

diff --git a/Website/layouts/default.vue b/Website/layouts/default.vue
index f88d83f..e7aaf4b 100644
--- a/Website/layouts/default.vue
+++ b/Website/layouts/default.vue
@@ -12,7 +12,7 @@
     <!-- abstract background -->
     <v-img
       src="/ui/abstract.svg"
-      style="position: absolute; left: 0; right: 0; width: 100%; height: 100%"
+      style="position: absolute; left: 0; right: 0; width: 100vw; height: 100vh"
     />
 
     <v-main style="padding-top: 4rem !important">
@@ -33,11 +33,11 @@ export default {
     links: [
       { name: "Home", path: "/" },
       { name: "Install", path: "/install" },
+      { name: "API", path: "/docs" },
       { name: "Help", path: "/help" },
       { name: "FAQ", path: "/faq" },
       { name: "Donate", path: "/donate" },
       { name: "Links", path: "/links" },
-      { name: "API", path: "/documentation" },
     ],
   }),
 };
@@ -62,7 +62,13 @@ body {
 }
 
 ::-webkit-scrollbar-thumb {
-  background-color: #ff4444; /* color of the scroll thumb */
+  background-color: #333; /* color of the scroll thumb */
+  border-radius: 20px; /* roundness of the scroll thumb */
+  border: 4px solid #111; /* creates padding around scroll thumb */
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background-color: #f22; /* color of the scroll thumb */
   border-radius: 20px; /* roundness of the scroll thumb */
   border: 4px solid #111; /* creates padding around scroll thumb */
 }
diff --git a/Website/package-lock.json b/Website/package-lock.json
index 3dca403..f25acec 100644
--- a/Website/package-lock.json
+++ b/Website/package-lock.json
@@ -14,7 +14,6 @@
         "vuetify": "^2.5.5"
       },
       "devDependencies": {
-        "@nuxtjs/device": "^2.1.0",
         "@nuxtjs/vuetify": "^1.12.1",
         "babel-eslint": "^10.1.0",
         "eslint": "^7.32.0",
@@ -2645,21 +2644,6 @@
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A=="
     },
-    "node_modules/@nuxtjs/device": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@nuxtjs/device/-/device-2.1.0.tgz",
-      "integrity": "sha512-TYBdt1w2bmCCWp+MhgcBATZtqyUBi3nSdNpcLGILw5USLwCsC/yZtIkq9YisuEzuRnod9w/RZpoE80MxLftEuA==",
-      "dev": true,
-      "dependencies": {
-        "defu": "^3.2.2"
-      }
-    },
-    "node_modules/@nuxtjs/device/node_modules/defu": {
-      "version": "3.2.2",
-      "resolved": "https://registry.npmjs.org/defu/-/defu-3.2.2.tgz",
-      "integrity": "sha512-8UWj5lNv7HD+kB0e9w77Z7TdQlbUYDVWqITLHNqFIn6khrNHv5WQo38Dcm1f6HeNyZf0U7UbPf6WeZDSdCzGDQ==",
-      "dev": true
-    },
     "node_modules/@nuxtjs/vuetify": {
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@nuxtjs/vuetify/-/vuetify-1.12.1.tgz",
@@ -16658,23 +16642,6 @@
         }
       }
     },
-    "@nuxtjs/device": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@nuxtjs/device/-/device-2.1.0.tgz",
-      "integrity": "sha512-TYBdt1w2bmCCWp+MhgcBATZtqyUBi3nSdNpcLGILw5USLwCsC/yZtIkq9YisuEzuRnod9w/RZpoE80MxLftEuA==",
-      "dev": true,
-      "requires": {
-        "defu": "^3.2.2"
-      },
-      "dependencies": {
-        "defu": {
-          "version": "3.2.2",
-          "resolved": "https://registry.npmjs.org/defu/-/defu-3.2.2.tgz",
-          "integrity": "sha512-8UWj5lNv7HD+kB0e9w77Z7TdQlbUYDVWqITLHNqFIn6khrNHv5WQo38Dcm1f6HeNyZf0U7UbPf6WeZDSdCzGDQ==",
-          "dev": true
-        }
-      }
-    },
     "@nuxtjs/vuetify": {
       "version": "1.12.1",
       "resolved": "https://registry.npmjs.org/@nuxtjs/vuetify/-/vuetify-1.12.1.tgz",
diff --git a/Website/pages/debug.vue b/Website/pages/debug.vue
index fbdfc50..a189c14 100644
--- a/Website/pages/debug.vue
+++ b/Website/pages/debug.vue
@@ -40,6 +40,9 @@
 
 <script>
 export default {
+  transition(to) {
+    return to.name == "debug" ? "swoop-in" : "swoop-out";
+  },
   data() {
     return {
       device: this.$ua,
diff --git a/Website/pages/documentation.vue b/Website/pages/docs.vue
similarity index 73%
rename from Website/pages/documentation.vue
rename to Website/pages/docs.vue
index ff21a68..8654fbd 100644
--- a/Website/pages/documentation.vue
+++ b/Website/pages/docs.vue
@@ -29,6 +29,15 @@
 
 <script>
 export default {
+  transition(to, from) {
+    if (!from) return "swoop-in";
+    let routes = ["index", "install", "docs", "help", "faq", "donate", "links"];
+    if (routes.indexOf(to.name) < 0) return "swoop-out";
+    if (routes.indexOf(from.name) < 0) return "swoop-in";
+    return routes.indexOf(to.name) > routes.indexOf(from.name)
+      ? "swoop-left"
+      : "swoop-right";
+  },
   data() {
     return {
       //---   Links To Generate Above    ---//
@@ -36,22 +45,22 @@ export default {
         {
           text: "Usage Rights",
           icon: "mdi-book-open-variant",
-          to: "/documentation/usage-rights",
+          to: "/docs/usage-rights",
         },
         {
           text: "URL Information",
           icon: "mdi-web",
-          to: "/documentation/url",
+          to: "/docs/url",
         },
         {
           text: "Available Endpoints",
           icon: "mdi-transit-connection-variant",
-          to: "/documentation/endpoints",
+          to: "/docs/endpoints",
         },
         {
           text: "Basic Fetching Tutorial",
           icon: "mdi-school",
-          to: "/documentation/fetching",
+          to: "/docs/fetching",
         },
       ],
     };
diff --git a/Website/pages/documentation/endpoints.vue b/Website/pages/docs/endpoints.vue
similarity index 100%
rename from Website/pages/documentation/endpoints.vue
rename to Website/pages/docs/endpoints.vue
diff --git a/Website/pages/documentation/fetching.vue b/Website/pages/docs/fetching.vue
similarity index 100%
rename from Website/pages/documentation/fetching.vue
rename to Website/pages/docs/fetching.vue
diff --git a/Website/pages/documentation/index.vue b/Website/pages/docs/index.vue
similarity index 100%
rename from Website/pages/documentation/index.vue
rename to Website/pages/docs/index.vue
diff --git a/Website/pages/documentation/url.vue b/Website/pages/docs/url.vue
similarity index 100%
rename from Website/pages/documentation/url.vue
rename to Website/pages/docs/url.vue
diff --git a/Website/pages/documentation/usage-rights.vue b/Website/pages/docs/usage-rights.vue
similarity index 100%
rename from Website/pages/documentation/usage-rights.vue
rename to Website/pages/docs/usage-rights.vue
diff --git a/Website/pages/donate.vue b/Website/pages/donate.vue
index b612058..f9e0ac8 100644
--- a/Website/pages/donate.vue
+++ b/Website/pages/donate.vue
@@ -23,7 +23,7 @@
 export default {
   transition(to, from) {
     if (!from) return "swoop-in";
-    let routes = ["index", "install", "help", "faq", "donate", "links"];
+    let routes = ["index", "install", "docs", "help", "faq", "donate", "links"];
     if (routes.indexOf(to.name) < 0) return "swoop-out";
     if (routes.indexOf(from.name) < 0) return "swoop-in";
     return routes.indexOf(to.name) > routes.indexOf(from.name)
diff --git a/Website/pages/faq.vue b/Website/pages/faq.vue
index 5ae1289..d8c3210 100644
--- a/Website/pages/faq.vue
+++ b/Website/pages/faq.vue
@@ -24,7 +24,7 @@
 export default {
   transition(to, from) {
     if (!from) return "swoop-in";
-    let routes = ["index", "install", "help", "faq", "donate", "links"];
+    let routes = ["index", "install", "docs", "help", "faq", "donate", "links"];
     if (routes.indexOf(to.name) < 0) return "swoop-out";
     if (routes.indexOf(from.name) < 0) return "swoop-in";
     return routes.indexOf(to.name) > routes.indexOf(from.name)
diff --git a/Website/pages/help.vue b/Website/pages/help.vue
index 589b188..8c5500c 100644
--- a/Website/pages/help.vue
+++ b/Website/pages/help.vue
@@ -101,7 +101,7 @@
 export default {
   transition(to, from) {
     if (!from) return "swoop-in";
-    let routes = ["index", "install", "help", "faq", "donate", "links"];
+    let routes = ["index", "install", "docs", "help", "faq", "donate", "links"];
     if (routes.indexOf(to.name) < 0) return "swoop-out";
     if (routes.indexOf(from.name) < 0) return "swoop-in";
     return routes.indexOf(to.name) > routes.indexOf(from.name)
diff --git a/Website/pages/index.vue b/Website/pages/index.vue
index bb44926..b4d79b5 100644
--- a/Website/pages/index.vue
+++ b/Website/pages/index.vue
@@ -81,7 +81,7 @@
 export default {
   transition(to, from) {
     if (!from) return "swoop-in";
-    let routes = ["index", "install", "help", "faq", "donate", "links"];
+    let routes = ["index", "install", "docs", "help", "faq", "donate", "links"];
     if (routes.indexOf(to.name) < 0) return "swoop-out";
     if (routes.indexOf(from.name) < 0) return "swoop-in";
     return routes.indexOf(to.name) > routes.indexOf(from.name)
diff --git a/Website/pages/install.vue b/Website/pages/install.vue
index a92b2f9..56b6814 100644
--- a/Website/pages/install.vue
+++ b/Website/pages/install.vue
@@ -76,7 +76,7 @@
 export default {
   transition(to, from) {
     if (!from) return "swoop-in";
-    let routes = ["index", "install", "help", "faq", "donate", "links"];
+    let routes = ["index", "install", "docs", "help", "faq", "donate", "links"];
     if (routes.indexOf(to.name) < 0) return "swoop-out";
     if (routes.indexOf(from.name) < 0) return "swoop-in";
     return routes.indexOf(to.name) > routes.indexOf(from.name)
diff --git a/Website/pages/links.vue b/Website/pages/links.vue
index 2259da8..f3da778 100644
--- a/Website/pages/links.vue
+++ b/Website/pages/links.vue
@@ -41,7 +41,7 @@
 export default {
   transition(to, from) {
     if (!from) return "swoop-in";
-    let routes = ["index", "install", "help", "faq", "donate", "links"];
+    let routes = ["index", "install", "docs", "help", "faq", "donate", "links"];
     if (routes.indexOf(to.name) < 0) return "swoop-out";
     if (routes.indexOf(from.name) < 0) return "swoop-in";
     return routes.indexOf(to.name) > routes.indexOf(from.name)