<script setup lang="ts">
import CarouseWithTitle from '@/components/CarouseWithTitle.vue';
import HomeEntrie from '@/components/HomeEntrie.vue';
</script>

<template>
  <v-container fluid>
    <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>

<style scoped></style>
