File dump from old repo

src/components/global/loader.vue

@@ -0,0 +1,110 @@
+<template>
+  <div class="lds-roller">
+    <div />
+    <div />
+    <div />
+    <div />
+    <div />
+    <div />
+    <div />
+    <div />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Loader',
+  data() {
+    return {
+    };
+  }
+};
+</script>
+
+<style scoped lang="scss">
+.lds-roller {
+  display: inline-block;
+  position: relative;
+  width: 80px;
+  height: 80px;
+  div {
+    animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
+    transform-origin: 40px 40px;
+    &:after {
+      content: "";
+      display: block;
+      position: absolute;
+      width: 7px;
+      height: 7px;
+      border-radius: 50%;
+      background: var(--primary);
+      margin: -4px 0 0 -4px;
+    }
+    &:nth-child(1) {
+      animation-delay: -0.036s;
+      &:after {
+        top: 63px;
+        left: 63px;
+      }
+    }
+    &:nth-child(2) {
+      animation-delay: -0.072s;
+      &:after {
+        top: 68px;
+        left: 56px;
+      }
+    }
+    &:nth-child(3) {
+      animation-delay: -0.108s;
+      &:after {
+        top: 71px;
+        left: 48px;
+      }
+    }
+    &:nth-child(4) {
+      animation-delay: -0.144s;
+      &:after {
+        top: 72px;
+        left: 40px;
+      }
+    }
+    &:nth-child(5) {
+      animation-delay: -0.18s;
+      &:after {
+        top: 71px;
+        left: 32px;
+      }
+    }
+    &:nth-child(6) {
+      animation-delay: -0.216s;
+      &:after {
+        top: 68px;
+        left: 24px;
+      }
+    }
+    &:nth-child(7) {
+      animation-delay: -0.252s;
+      &:after {
+        top: 63px;
+        left: 17px;
+      }
+    }
+    &:nth-child(8) {
+      animation-delay: -0.288s;
+      &:after {
+        top: 56px;
+        left: 12px;
+      }
+    }
+  }
+}
+
+@keyframes lds-roller {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+</style>

src/components/global/navbar/navbar.vue

@@ -0,0 +1,110 @@
+<template>
+  <nav class="navbar navbar-expand-sm fixed-top navbar-dark bg-dark">
+    <router-link
+      :to="'/'"
+      class="navbar-brand font-display font-weight-700"
+    >
+      Auracle
+    </router-link>
+    <button
+      class="navbar-toggler"
+      type="button"
+      data-toggle="collapse"
+      data-target="#navbar"
+      aria-controls="navbar"
+      aria-expanded="false"
+      aria-label="Toggle navigation"
+    >
+      <span class="navbar-toggler-icon" />
+    </button>
+    <div
+      id="navbar"
+      class="collapse navbar-collapse"
+    >
+      <ul
+        v-if="links.length != 0"
+        class="navbar-nav mr-auto"
+      >
+        <li
+          v-for="(link, index) in links"
+          :key="index"
+          class="nav-item"
+        >
+          <router-link
+            :to="link.url"
+            class="nav-link"
+          >
+            {{ link.text }}
+          </router-link>
+        </li>
+      </ul>
+      <div
+        v-if="user"
+        class="navbar-nav"
+      >
+        <router-link
+          :to="'/profil'"
+          class="nav-link"
+        >
+          {{ user.name }}
+        </router-link>
+        <div
+          class="nav-link"
+          @click="logoutUser()"
+        >
+          Deconnexion
+        </div>
+      </div>
+      <div
+        v-else
+        class="navbar-nav"
+      >
+        <router-link
+          :to="'/connexion'"
+          class="nav-link"
+        >
+          Connexion
+        </router-link>
+      </div>
+    </div>
+  </nav>
+</template>
+
+<script>
+
+export default {
+  name: 'Navbar',
+  data() {
+    return {
+      links: [
+        {
+          text: 'Sortilèges',
+          url: '/sorts',
+        },
+        {
+          text: 'Écoles',
+          url: '/ecoles',
+        },
+        {
+          text: 'Chronologie',
+          url: '/ages',
+        }
+      ]
+    };
+  },
+  computed: {
+    user() {
+      return this.$store.getters.getUserProfile;
+    }
+  },
+  methods: {
+    logoutUser() {
+      this.$store.dispatch('user_logout');
+      this.$router.push('/');
+    }
+  }
+};
+
+</script>
+
+<style lang="scss"></style>