site_logiciels/pages/opentalent_manager.vue

<template>
  <CommonMeta
    title="Opentalent Manager"
    description="Opentalent Manager, la solution sur-mesure pour gérer et communiquer au sein de réseaux culturels. Idéal pour fédérations et institutions."
  />

  <div class="theme-manager">
    <LogicielsTitle>
      <template #left-text>School</template>
      Opentalent Manager
      <template #right-text>Artist</template>
    </LogicielsTitle>

    <CommonBanner
      image-src="/images/logiciels/manager/banner-manager.png"
      image-alt="Visuel d’un réseau avec des branches de couleur rouge, bleu et jaune, qui montre les différents types de structures"
      square-text="Fédérations, confédérations et collectivités"
      logo-src="/images/logo/logiciels/Manager-noir.png"
      logo-alt="Logo Opentalent Manager - logiciel de gestion et de communication pour les fédérations, les confédérations et les collectivités"
    />

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

    <CommonActionMenu :actions="stickyMenuActions" />

    <LogicielsManagerPresentation />

    <LogicielsManagerAvantages />

    <div v-if="mdAndUp" class="alt-theme">
      <LogicielsManagerFonctionnalites />
    </div>

    <LogicielsManagerNetwork />

    <LogicielsManagerFormation />

    <LogicielsManagerReviews />

    <LayoutFAQ />

    <LayoutFooterSolutions :show-manager="false" />
  </div>
</template>

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

const { mdAndUp, lgAndUp } = useDisplay()

const menus: Array<MenuScroll> = ref([
  { anchor: "presentation", label: "Présentation" },
  { anchor: "benefits", label: "Avantages" },
  { anchor: "functionalities", label: "Fonctionnalités" },
  { anchor: "network", label: "Réseau" },
  { anchor: "webinars", label: "Formations" },
  { anchor: "testimonials", label: "Témoignages" },
]).value;

const stickyMenuActions: Array<ActionMenuItem> = [
  {
    type: ActionMenuItemType.FOLLOW_LINK,
    color: "primary",
    icon: "fa-regular fa-comments icon",
    text: "Nous contacter",
    url: "/nous-contacter",
  },
  {
    type: ActionMenuItemType.FOLLOW_LINK,
    color: "primary",
    icon: "fa-brands fa-readme icon",
    text: "Brochure",
    url: "https://www.opentalent.fr/fileadmin/user_upload/Manager.pdf",
  },
  {
    type: ActionMenuItemType.CALL_US,
    color: "secondary",
    icon: "fa-solid fa-phone icon",
    text: "Nous appeler",
  },
];
</script>


<style scoped>
.theme-manager {
  --primary-color: #ffffff;
  --on-primary-color: #0e2d32;
  --on-primary-color-alt: var(--manager-color);
  --secondary-color: var(--manager-color-light);

  --action-menu-primary-color: var(--manager-color);
  --action-menu-on-primary-color: var(--on-primary-color);
  --action-menu-secondary-color: var(--primary-color);
  --action-menu-on-secondary-color: var(--on-primary-color);
}
</style>