Fix scroll arrow, remove jquery and bootstrap.js

Grathium-Industries · Feb 7, 2024 · 3f2aa78 · 3f2aa78
1 parent c7151bd
commit 3f2aa78
Show file tree

Hide file tree

Showing 11 changed files with 8 additions and 266 deletions.
diff --git a/public/lib/bootstrap.min.js b/public/lib/bootstrap.min.js
diff --git a/public/lib/jquery.min.js b/public/lib/jquery.min.js
diff --git a/public/static/css/dist/style.css b/public/static/css/dist/style.css
@@ -1,5 +1,4 @@
 @import url("https://fonts.googleapis.com/css2?family=Syne:wght@700;800&display=swap");
-@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300&display=swap");
 html {
   background-color: #1a1a1a;
   overflow-x: hidden;
@@ -42,11 +41,11 @@ html {
   -webkit-transform: translate3d(-50%, -50%, 0);
   transform: translate3d(-50%, -50%, 0);
 }
-.main-title p {
+.main-title .title-description {
   font-size: 1.5em;
-  font-family: "Inter", sans-serif;
 }
-.main-title p a {
+.main-title .title-description a {
+  font-size: inherit;
   color: white;
   text-decoration: none;
 }
@@ -141,33 +140,6 @@ iframe {
   overflow: auto;
 }
 
-#back2Top {
-  width: 40px;
-  line-height: 40px;
-  overflow: hidden;
-  z-index: 999;
-  display: none;
-  cursor: pointer;
-  -moz-transform: rotate(270deg);
-  -webkit-transform: rotate(270deg);
-  -o-transform: rotate(270deg);
-  -ms-transform: rotate(270deg);
-  transform: rotate(270deg);
-  position: fixed;
-  bottom: 50px;
-  right: 0;
-  background-color: #fafafa;
-  color: #555;
-  text-align: center;
-  font-size: 30px;
-  text-decoration: none;
-}
-
-#back2Top:hover {
-  background-color: #ddf;
-  color: #1a1a1a;
-}
-
 div.arrow {
   width: 6vmin;
   height: 6vmin;

diff --git a/public/static/css/style.scss b/public/static/css/style.scss
@@ -1,6 +1,5 @@
 // font imports
 @import url("https://fonts.googleapis.com/css2?family=Syne:wght@700;800&display=swap");
-@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300&display=swap");
 
 $background-color: #1a1a1a;
 $secondary-color: #fafafa;
@@ -49,11 +48,11 @@ html {
     -webkit-transform: translate3d(-50%, -50%, 0);
     transform: translate3d(-50%, -50%, 0);
 
-    p {
+    .title-description {
         font-size: 1.5em;
-        font-family: "Inter", sans-serif;
 
         a {
+            font-size: inherit;
             color: white;
             text-decoration: none;
         }
@@ -156,33 +155,6 @@ iframe {
     overflow: auto;
 }
 
-#back2Top {
-    width: 40px;
-    line-height: 40px;
-    overflow: hidden;
-    z-index: 999;
-    display: none;
-    cursor: pointer;
-    -moz-transform: rotate(270deg);
-    -webkit-transform: rotate(270deg);
-    -o-transform: rotate(270deg);
-    -ms-transform: rotate(270deg);
-    transform: rotate(270deg);
-    position: fixed;
-    bottom: 50px;
-    right: 0;
-    background-color: $secondary-color;
-    color: #555;
-    text-align: center;
-    font-size: 30px;
-    text-decoration: none;
-}
-
-#back2Top:hover {
-    background-color: #ddf;
-    color: $background-color;
-}
-
 div.arrow {
     width: 6vmin;
     height: 6vmin;

diff --git a/public/static/js/global.ts → public/static/js/cookies.ts b/public/static/js/global.ts → public/static/js/cookies.ts
diff --git a/public/static/js/dist/global.js → public/static/js/dist/cookies.js b/public/static/js/dist/global.js → public/static/js/dist/cookies.js
diff --git a/public/static/js/dist/script.js b/public/static/js/dist/script.js
diff --git a/public/static/js/script.ts b/public/static/js/script.ts
diff --git a/src/components/CookieConsent.astro b/src/components/CookieConsent.astro
@@ -49,6 +49,6 @@
       gtag("config", "G-R245NSN3MZ");
     </script>
 
-    <script is:inline src="/static/js/dist/global.js"></script>
+    <script is:inline src="/static/js/dist/cookies.js"></script>
   </div>
 </footer>
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
@@ -17,16 +17,6 @@ import CookieConsent from "../components/CookieConsent.astro"
       crossorigin="anonymous"
     />
     <link rel="stylesheet" href="/static/css/dist/global.css" />
-    <script
-      is:inline
-      is:inline
-      src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"
-      integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V"
-      crossorigin="anonymous"></script>
-    <script
-      is:inline
-      is:inline
-      src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
     <meta name="generator" content={Astro.generator} />
     <title>Grathium Industries</title>
   </head>

diff --git a/src/pages/index.astro b/src/pages/index.astro
@@ -21,20 +21,18 @@ import Layout from "../layouts/Layout.astro";
             <h1 id="title">
               <span class="thin">Grathium</span> [Industries]
             </h1>
-            <p>
+            <p class="title-description">
               <a href="https://github.com/hudson-newey">Hudson Newey's</a>
               Internet showcase.
             </p>
           </div>
         </div>
       </div>
       <a href="#content" onclick="scrollToContent();">
-        <div class="arrow"></div>
+        <div class="arrow" onclick="document.getElementsByClassName('websiteScroll')[0]?.scrollIntoView()"></div>
       </a>
     </body>
 
-    <a id="back2Top" title="Back to top" href="#">&#10148;</a>
-
     <div class="websiteScroll">
       <div class="black-background">
         <div class="d-flex flex-row justify-content-start m-5">