Home Page

+ Added Information
+ First and Second Entrie

GUI/src/routes/Home.vue

@@ -1,22 +1,60 @@
 <script setup lang="ts">
-import { useTheme } from 'vuetify';
-
-const theme = useTheme();
+import CarouseWithTitle from '@/components/CarouseWithTitle.vue';
+import HomeEntrie from '@/components/HomeEntrie.vue';
 </script>
 
 <template>
   <v-container fluid>
-    <v-img
-      class="rounded-lg"
-      height="30vh"
-      src="/static/images/house/front.jpg"
-      cover
-      :gradient="
-        theme.name.value === 'dark'
-          ? 'rgba(0,0,0,0.5), rgba(0,0,0,0.5)'
-          : 'rgba(255,255,255,0.5), rgba(255,255,255,0.5)'
-      "
-    />
+    <v-img class="rounded-lg" height="40vh" src="/static/images/startPage.png" cover />
+
+    <main>
+      <v-container
+        id="main"
+        :style="{
+          maxWidth: $vuetify.display.smAndDown ? '100vw' : '60vw',
+        }"
+        fluid
+      >
+        <home-entrie title="Herzlich Willkommen!">
+          <template #text>
+            <b>Schön, dass du den Weg zu uns gefunden hast!</b> Egal, ob du schon lange dabei bist
+            oder das erste Mal von Judo hörst – wir freuen uns, dich bald (wieder) in unserem
+            <b>Judozentrum</b>
+            (Dojo) begrüßen zu dürfen.
+          </template>
+        </home-entrie>
+        <home-entrie
+          title="Was ist Judo?"
+          extra-beside-text
+          :extra-width-percent="50"
+          title-in-split-right
+        >
+          <template #text>
+            Judo ist eine Sportart, welche den ganzen Körper fordert, fördert und beansprucht. Es
+            werden also <b>sämtliche Muskelgruppen, sowie das Köpfchen bei uns trainiert. </b>
+            <b>Judo bedeutet übersetzt “der sanfte Weg”.</b> Daraus lässt sich ja schon erahnen,
+            dass Judo eine Kampfsportart ist bei der das "Schlagen" oder "Treten" des Gegners
+            verboten ist. Beim Judo beschränkt man sich rein auf das <b>Werfen</b>,
+            <b>fixieren am Boden</b>, <b>Hebeln</b> und <b>Hebeln</b> (nur für die älteren) des
+            Partners/Gegners.
+          </template>
+
+          <template #extra>
+            <v-carousel
+              show-arrows="hover"
+              hide-delimiter-background
+              class="rounded-lg"
+              cycle
+              interval="6000"
+            >
+              <carouse-with-title text="Werfen" image="/static/images/whatsJudo/throw.jpg"/>
+              <carouse-with-title text="fixieren am Boden" image="/static/images/whatsJudo/hold.jpg"/>
+              <carouse-with-title text="Trainieren aller Muskelgruppen" image="/static/images/whatsJudo/stabil.jpg"/>
+            </v-carousel>
+          </template>
+        </home-entrie>
+      </v-container>
+    </main>
   </v-container>
 </template>