add switch for hero/start page; add light theme toggle

frontend/components/Hero.vue

+<template>
+  <v-container class="d-flex" fill-height>
+    <v-row class="justify-center align-center">
+      <h1
+        align="center"
+        class="text-xs-h4 center text-sm-h2 text-lg-h1 font-weight-medium"
+      >
+        Spaß mit Wappen
+      </h1>
+    </v-row>
+    <v-row class="justify-center">
+      <v-btn
+        color="primary"
+        elevation="4"
+        x-large
+        dark
+        @click="$store.commit('setShowHero', false)"
+      >
+        Start
+      </v-btn>
+    </v-row>
+  </v-container>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

frontend/components/Home.vue

+<template>
+  <v-container> </v-container>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style></style>

frontend/layouts/default.vue

 <template>
   <v-app dark>
+    <v-btn text icon @click="toggleTheme">
+      <v-icon>mdi-theme-light-dark</v-icon>
+    </v-btn>
     <v-main>
       <nuxt />
     </v-main>
-    <v-footer class="justify-center" app>
-      <span>
+    <v-footer app>
+      <v-flex text-center>
         Diese Website steht in keiner Verbindung mit den abgebildeten Kommunen
-      </span>
+      </v-flex>
     </v-footer>
   </v-app>
 </template>
 
 <script>
-export default {};
+export default {
+  methods: {
+    toggleTheme() {
+      this.$vuetify.theme.dark = !this.$vuetify.theme.dark;
+    },
+  },
+};
 </script>

frontend/pages/index.vue

 <template>
-  <v-container class="d-flex" fill-height>
-    <v-row class="justify-center align-center">
-      <h1 class="text-xs-h4 text-sm-h2 text-lg-h1 font-weight-medium">
-        Spaß mit Wappen
-      </h1>
-    </v-row>
-    <v-row class="justify-center">
-      <v-btn color="primary" dark>Start</v-btn>
-    </v-row>
+  <v-container v-if="$store.state.showHero" fill-height>
+    <Hero />
   </v-container>
+  <v-container v-else fill-height> </v-container>
 </template>
 
 <script>
+import Hero from "~/components/Hero.vue";
 export default {
-  components: {},
+  components: {
+    Hero,
+  },
 };
 </script>

frontend/store/index.js

+export const state = () => ({
+  showHero: true,
+});
+
+export const mutations = {
+  setShowHero(state, value) {
+    state.showHero = value;
+  },
+};