Merge pull request #31 from Hilfstelefon-WirVsVirus/remove_vue_fragment

Remove vue-fragment

package.json

@@ -14,7 +14,6 @@
     "core-js": "^3.6.4",
     "register-service-worker": "^1.6.2",
     "vue": "^2.6.11",
-    "vue-fragment": "^1.5.1",
     "vue-i18n": "^8.0.0",
     "vue-router": "^3.1.5",
     "vuex": "^3.1.2",

src/components/Card.vue

@@ -17,7 +17,8 @@ export default {
     padding: 30px 20px;
     margin: 0 5px;
     text-align: center;
-    height: 400px;
+    min-height: 400px;
     @include shadow(30);
+    position: relative;
   }
 </style>

src/components/IssueCard.vue

@@ -40,7 +40,7 @@
 <script>
 import WaveSurfer from 'wavesurfer.js';
 import { mapActions } from 'vuex';
-import cardStates from '../utils/cardStates';
+import cardStates from '../utils/states';
 
 export default {
   name: 'IssueCard',

src/components/Navigation.vue

@@ -2,7 +2,7 @@
     <nav class="navigation">
       <ul class="navigation__list">
         <li class="navigation__list-item">
-          <router-link to="/impress">{{ $t('navigation.imprint') }}</router-link>
+          <router-link to="/imprint">{{ $t('navigation.imprint') }}</router-link>
         </li>
         <li class="navigation__list-item">
           <a href="//wirvsvirushackathon.org/" class="navigation__link">
@@ -31,6 +31,9 @@ export default {
     display: flex;
     justify-content: center;
     margin-top: 50px;
+    position: absolute;
+    width: 100%;
+    bottom: 20px;
 
     @media #{$mobile} {
       font-size: 24px;

src/locales/de.json

@@ -32,7 +32,7 @@
     "questions": "Fragen",
     "support": "Unterstüzung"
   },
-  "impress": {
+  "imprint": {
     "intro": "Intro"
   }
 }

src/router/index.js

@@ -1,7 +1,6 @@
 import Vue from 'vue';
 import VueRouter from 'vue-router';
 import Home from '../views/Home.vue';
-import Dashboard from '../views/Dashboard.vue';
 import MyTasks from '../views/MyTasks.vue';
 import AllTasks from '../views/AllTasks.vue';
 import EditTask from '../views/EditTask.vue';
@@ -17,7 +16,7 @@ const routes = [
   {
     path: '/dashboard',
     name: 'Dashboard',
-    component: Dashboard,
+    component: () => import(/* webpackChunkName: "dashboard" */ '../views/Dashboard.vue'),
     children: [
       {
         path: '',
@@ -34,9 +33,9 @@ const routes = [
     ],
   },
   {
-    path: '/impress',
-    name: 'Impress',
-    component: () => import(/* webpackChunkName: "impress" */ '../views/Impress.vue'),
+    path: '/imprint',
+    name: 'Imprint',
+    component: () => import(/* webpackChunkName: "imprint" */ '../views/Imprint.vue'),
   },
 ];
 

src/store/index.js

@@ -1,6 +1,6 @@
 import Vue from 'vue';
 import Vuex from 'vuex';
-import cardStates from '../utils/cardStates';
+import cardStates from '../utils/states';
 
 Vue.use(Vuex);
 

src/views/Impress.vue → src/views/Imprint.vue

@@ -6,7 +6,7 @@
         <div class="content__logo logo">
           <img class="logo__image" src="/img/icons/landing_graphic.svg" :alt="$t('meta.title')"/>
         </div>
-        <div class="content__text">{{ $t('impress.intro') }}</div>
+        <div class="content__text">{{ $t('imprint.intro') }}</div>
       </div>
       <Card>
         <div class="users">