<template>
  <CommonMeta
    title="Formation - Opentalent"
    description="Prise en main ou piqûre de rappel, on est toujours à vos côtés."
  />

  <LayoutUITitlePage>
    Formation
    <template #subtitle>
      Prise en main ou piqûre de rappel, on est toujours à vos côtés.
    </template>
  </LayoutUITitlePage>

  <CommonBanner
    imageSrc="images/formation/banner.jpg"
    imageAlt="banner"
  >
    <template #watermark>
      Et si vous passiez rapidement à la vitesse supérieure...
    </template>
  </CommonBanner>

  <CommonMenuScroll v-if="lgAndUp" :menus="menus" class="mb-6" />

  <CommonActionMenu />

  <FormationPresentation />

  <div v-if="lgAndUp">
    <FormationCatalogue />
  </div>

  <FormationOPCA />

  <FormationCertification />

  <FormationParticipation />

  <FormationReviews />

  <LayoutFAQ />

  <LayoutFooterSolutions />
</template>

<script setup lang="ts">
import type { MenuScroll } from "~/types/interface";
import { useDisplay } from "vuetify";

const { lgAndUp } = useDisplay()

const menus: Array<MenuScroll> = [
  { anchor: "presentation", label: "Présentation" },
  { anchor: "catalog", label: "Catalogue" },
  { anchor: "financing", label: "Financement" },
  { anchor: "certification", label: "Certification" },
  { anchor: "inscription", label: "Inscription" },
  { anchor: "testimonials", label: "Témoignages" }
];
</script>
