added a new site and a gamefield component

GUI/src/Home.vue

@@ -4,6 +4,7 @@ let buttons = [
         name: "Lokaler Multiplayer",
         icon: "mdi-account-switch",
         color: "red",
+        componentName: "LocalMode"
     },
     {
         name: "Lokal gegen Bot",
@@ -31,6 +32,7 @@ let buttons = [
                     v-for="button of buttons"
                     :key="button.name"
                     :color="button.color"
+                    :to="{ name: button.componentName }"
                     size="x-large"
                     min-width="340"
                     rounded="xl"

GUI/src/Layout.vue

@@ -6,7 +6,11 @@
       <template v-slot:image>
         <v-img gradient="to top right, rgba(5, 5, 5, 0.6), rgba(50, 50, 60, 0.6)"></v-img>
       </template>
-      <v-app-bar-title class="font-weight-semibold text-white">
+      <v-app-bar-title 
+        class="font-weight-semibold text-white" 
+        @click="$router.push('/')"
+        style="cursor: pointer;"
+      >
         4-Gewinnt
       </v-app-bar-title>
     </v-app-bar>

GUI/src/components/Game/Field.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+const gameState = defineModel<number[][]>('gameState', {
+  required: true
+})
+</script>
+
+<template>
+  <div id="spielfeld" class="d-flex flex-collum">
+    <div v-for="row in gameState">
+      <v-img v-for="field in row" src="./Game/Gamefield/Gamefield.svg" height="100px" width="100px"></v-img>
+    </div>
+  </div>
+</template>
+
+<style scoped></style>

GUI/src/router/index.ts

@@ -1,5 +1,6 @@
 import Home from '@/Home.vue'
 import NotFound from '@/NotFound.vue'
+import LocalMode from '@/routes/LocalMode.vue'
 import { createRouter, createWebHistory } from 'vue-router'
 
 const router = createRouter({
@@ -10,6 +11,11 @@ const router = createRouter({
       name: 'Startseite',
       component: Home,
     },
+    {
+      path: "/localMode",
+      name: "LocalMode",
+      component: LocalMode
+    },
     { path: '/:pathMatch(.*)*', name: 'Nicht gefunden', component: NotFound },
   ],
 })

GUI/src/routes/LocalMode.vue

@@ -0,0 +1,20 @@
+<script setup lang="ts">
+import Field from '@/components/Game/Field.vue';
+
+const gameField = [
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+];
+
+</script>
+
+<template>
+    <Field :game-state="gameField"></Field>
+</template>
+
+<style scoped>
+</style>