fml

client/src/components/global/navbar/navbar.vue

@@ -1,4 +1,5 @@
 <template>
+  <div class="sticky-top">
     <nav class="navbar navbar-expand-sm navbar-dark bg-dark">
       <a class="navbar-brand font-display font-weight-700" href="#">Auracle</a>
       <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
@@ -12,6 +13,7 @@
         </ul>
       </div>
     </nav>
+  </div>
     <!--<nav class="navbar navbar-dark">
         <ul v-if="links.length != 0">
             <li v-for="(link, index) in links" :key="index">
@@ -22,7 +24,6 @@
 </template>
 
 <script>
-
     export default {
         name: 'navbar',
         data() {
@@ -49,78 +50,4 @@
     }
 </script>
 
-<style lang="scss">
-    /*
-    nav {
-        width: 100%;
-        position: fixed;
-        top: 0;
-        padding-left: 2rem;
-
-        ul {
-            display: flex;
-            li {
-                a {
-                    position: relative;
-                    margin-right: 1rem;
-                    padding: 1.5rem;
-                    display: block;
-                    font-size: .83rem;
-                    font-weight: $font-bold;
-                    text-transform: uppercase;
-                    text-shadow: none;
-                    transition: text-shadow .5s cubic-bezier(0.645, 0.045, 0.355, 1);
-                    
-                    &:after {
-                        position: absolute;
-                        display: block;
-                        left: 50%;
-                        bottom: 0;
-                        transform: translateX(-50%);
-                        width: 0;
-                        height: 3px;
-                        content: '';
-                        box-shadow: none;
-                        transition: width .5s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow .5s cubic-bezier(0.645, 0.045, 0.355, 1);
-                    }
-
-                    &:hover,
-                    &.router-link-exact-active {
-                        @include blue-glow-text(.5);
-                        &:after {
-                            width: 80%;
-                            transition: width .5s cubic-bezier(0.645, 0.045, 0.355, 1);
-                            @include blue-glow-box(.5);
-                        }
-                    }
-                }
-            }
-        }
-
-        &.navbar-light {
-            ul {
-                li {
-                    a {
-                        color: $black;
-                        &:after {
-                            background: $black;
-                        }
-                    }
-                }
-            }
-        }
-        &.navbar-dark {
-            ul {
-                li {
-                    a {
-                        color: $white;
-                        &:after {
-                            background: $white;
-                        }
-                    }
-                }
-            }
-        }
-    }
-    */
-</style>
+<style lang="scss"></style>