opentalent-artist.vue 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. <template>
  2. <div>
  3. <CommonMeta
  4. title="Opentalent Artist - Logiciels de gestion et de communication pour les orchestres, les chorales, les compagnies de danse, de cirque et de théâtre"
  5. description="Optimisez votre organisation avec Opentalent Artist. Gérez efficacement les membres, activités et équipements. Booster votre communication avec notre logiciel intuitif."
  6. />
  7. <div class="theme-artist">
  8. <CommonActionMenu :actions="stickyMenuActions" />
  9. <LogicielsTitle>
  10. <template #left-text>School</template>
  11. Opentalent Artist
  12. <template #right-text>Manager</template>
  13. </LogicielsTitle>
  14. <CommonBanner
  15. image-src="/images/pages/opentalent_artist/banner/Groupe_de_musique_jouant_dans_la_rue.webp"
  16. image-alt="Groupe de musique jouant dans la rue"
  17. square-text="Orchestres, chorales, compagnies et troupes artistiques"
  18. logo-src="/images/logos/opentalent/Logo_Opentalent_Artist-gris.png"
  19. logo-alt="Logo Opentalent Artist - logiciel de gestion et de communication pour les orchestres, les chorales, les compagnies artistiques et troupes"
  20. />
  21. <CommonMenuScroll v-if="lgAndUp" :menus="menus" class="mb-6" />
  22. <LogicielsArtistPresentation />
  23. <LogicielsArtistAvantages class="mt-8" />
  24. <div class="alt-theme">
  25. <LogicielsArtistFonctionnalites />
  26. </div>
  27. <LogicielsArtistComparatif />
  28. <LogicielsArtistAbonnement />
  29. <LogicielsArtistFormations class="mb-12" />
  30. <LogicielsArtistReviews />
  31. <LayoutFAQ />
  32. <LayoutFooterPrefooter />
  33. </div>
  34. </div>
  35. </template>
  36. <script setup lang="ts">
  37. import { useDisplay } from 'vuetify'
  38. import { ActionMenuItemType } from '~/types/enum/layout'
  39. import type { MenuScroll, ActionMenuItem } from '~/types/interface'
  40. const { lgAndUp } = useDisplay()
  41. const menus: Array<MenuScroll> = [
  42. { anchor: 'presentation', label: 'Présentation' },
  43. { anchor: 'benefits', label: 'Avantages' },
  44. { anchor: 'functionalities', label: 'Fonctionnalités' },
  45. { anchor: 'comparative', label: 'Comparatif' },
  46. { anchor: 'subscription', label: 'Abonnement' },
  47. { anchor: 'webinars', label: 'Webinaires' },
  48. { anchor: 'testimonials', label: 'Témoignages' },
  49. ]
  50. const stickyMenuActions: Array<ActionMenuItem> = [
  51. {
  52. type: ActionMenuItemType.ASK_FOR_A_DEMO,
  53. color: 'primary',
  54. icon: 'far fa-comments',
  55. text: 'Nous contacter',
  56. url: '/nous-contacter',
  57. },
  58. {
  59. type: ActionMenuItemType.FOLLOW_LINK,
  60. color: 'primary',
  61. icon: 'fa-brands fa-readme icon',
  62. text: 'Brochure',
  63. url: '/files/Depliant_Opentalent_Artist_2024.pdf',
  64. target: '_blank',
  65. },
  66. ]
  67. </script>
  68. <style scoped lang="scss">
  69. .theme-artist {
  70. --primary-color: #ffffff;
  71. --on-primary-color: #0e2d32;
  72. --primary-color-alt: var(--on-secondary-color);
  73. --on-primary-color-alt: var(--artist-color);
  74. --secondary-color: var(--artist-color-light);
  75. --action-menu-primary-color: var(--artist-color);
  76. --action-menu-on-primary-color: var(--on-secondary-color);
  77. --action-menu-secondary-color: #fef3ce;
  78. --action-menu-on-secondary-color: var(--on-secondary-color);
  79. }
  80. </style>