Added floating 'join' btn

src/layouts/partials/floating-join-btn.html

@@ -0,0 +1,36 @@
+<style>
+ .gf-container {
+   width: 8vw;
+   height: 8vw;
+   border-radius: 100px;
+   display: flex;
+   flex-direction: column;
+   position: fixed;
+   text-align:center;
+   padding-top: 3vw;
+   font-size: 1.562vw;
+   background-color: #1a1a1a !important;
+   border: 2px solid #949494;
+   color: #ffffff;
+   text-decoration: none;
+   font-family: "pp-neue-machina", sans-serif;
+   text-transform: uppercase;
+   right: 15px;
+   top: 5.3vw;
+   cursor: pointer;
+   z-index: 3;
+   transition: 0.2s ease-in-out;
+ }
+
+ .gf-container:hover {
+   color:#1a1a1a;
+   box-shadow: inset 0vw 0vw 0vw 0.358vw #1a1a1a !important;
+   background-color: #00ffd0 !important;
+
+ }
+
+</style>
+
+<a href="https://github.com/login/oauth/authorize?client_id=9d1f1a72f1300b6991df&state=teaxyz" class="gf-container" style="background-color:#8EC7BF;">
+ JOIN
+</a>

src/layouts/partials/head.html

@@ -78,5 +78,8 @@
         window.location.replace(`${window.location.origin}${window.location.pathname}`)
       }
     </script>
+
+    {{- partial "floating-join-btn.html" . -}}
+    
   </head>
 </head>

src/layouts/partials/header.html

@@ -1,63 +0,0 @@
-     <style>
-      .gf-container {
-        width: 80px;
-        height: 80px;
-        border-radius: 60px;
-        display: flex;
-        flex-direction: column;
-        position: fixed;
-        right: 15px;
-        bottom: 15px;
-        cursor: pointer;
-        box-shadow: 0 0 0 rgba(204, 169, 44, 0.4);
-        animation: pulse 2s infinite;
-        z-index: 200;
-      }
-
-      .gf-container:hover {
-        animation: none;
-      }
-
-      @-webkit-keyframes pulse {
-        0% {
-          -webkit-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0.4);
-        }
-
-        70% {
-          -webkit-box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
-        }
-
-        100% {
-          -webkit-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
-        }
-      }
-
-      @keyframes pulse {
-        0% {
-          -moz-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0.4);
-          box-shadow: 0 0 0 0 rgba(204, 169, 44, 0.4);
-        }
-
-        70% {
-          -moz-box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
-          box-shadow: 0 0 0 10px rgba(204, 169, 44, 0);
-        }
-
-        100% {
-          -moz-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
-          box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
-        }
-      }
-
-      .github-icon {
-        width: 60%;
-        margin-top: auto;
-        margin-bottom: auto;
-      }
-      
-    </style>
-
-    <a href="https://github.com/login/oauth/authorize?client_id=9d1f1a72f1300b6991df&state=teaxyz" class="gf-container" style="background-color:#8EC7BF;">
-      <img src="/Images/github.svg" alt="" class="github-icon mx-auto">
-
-    </a>