Initial Nuxt frontend import

- Complete GGZ Ecademy Nuxt.js user portal
- Learning products browser and management
- Member management interface
- User authentication and roles
- Multi-language support (NL/EN)
- Vuex store for state management
- Component-based architecture

components/UI/Loading/Loading.vue

@@ -0,0 +1,75 @@
+<template>
+  <v-overlay :value="loading" color="#013447">
+    <div class="loading">
+      <div class="spinner">
+        <img class="logo one" :src="mySVG" />
+      </div>
+      <div class="spinner">
+        <img class="logo two" :src="mySVG" />
+      </div>
+      <span>{{ $t('general.loading') }}</span>
+    </div>
+  </v-overlay>
+</template>
+
+<script>
+export default {
+  data() {
+    return{
+      loading: false,
+      mySVG: require('assets/img/ggz/loading-logo.svg')
+    }
+  },
+  methods: {
+    start() {
+      this.loading = true
+    },
+    finish() {
+      this.loading = false
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.loading {
+  width: 140px;
+  height: 180px;
+  margin: auto;
+  margin-bottom: 25px;
+  display: flex;
+  justify-content: center;
+  .spinner {
+    width: 100%;
+    position: absolute;
+    .one {
+      transform: rotate(25deg);
+    }
+    -webkit-animation: spin 5s linear infinite;
+    animation: spin 5s linear infinite;
+  }
+
+  span{
+    display:flex;
+    align-items: flex-end;
+    font-family:"Source Sans Pro", sans-serif;
+  }
+}
+@-webkit-keyframes spin {
+  0% {
+    -webkit-transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+  }
+}
+
+@keyframes spin {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+</style>