resolve merge conflicts

README.md

@@ -46,3 +46,14 @@ Ou utiliser la commande custom :
 Pour déboguer en prod : 
 
     sudo supervisorctl tail -6000 site_logiciels:site_logiciels_00 stderr
+
+
+### Tester la qualité du code 
+
+Pour tester : 
+
+    yarn lint
+
+Pour tester et corriger automatiquement les erreurs qui peuvent l'être : 
+
+    yarn lint --fix

components/About/Chronologie.client.vue

@@ -33,6 +33,7 @@
             v-model="activeSlide"
             :items-to-show="lgAndUp ? 2 : 1"
             :items-to-scroll="1"
+            :wrap-around="true"
           >
             <Slide
               v-for="(slide, index) in slides"
@@ -110,15 +111,15 @@ const slides: Array<ChronologyItem> = [
     year: '2005',
     title: "L'origine d'Opentalent",
     description:
-      "Sous une pleine lune inspirante, Guillaume alors imagine un outil collaboratif en ligne révolutionnaire pour le secteur culturel. Cette idée germe alors qu'il est président d'orchestre et membre du CA d'une école de musique, marquant le début du concept Opentalent.",
+      'Sous une pleine lune, face à la démobilisation des bénévoles concernant la gestion administrative, Guillaume imagine un outil collaboratif en ligne pour le secteur culturel. Cette idée émerge alors qu’il préside l’orchestre d’harmonie, membre du conseil d’administration de l’école de musique et de la Fédération des musiques du Faucigny, marquant le début du concept Openassos.',
     imageUrl:
-      '/images/pages/qui-sommes-nous/chronologie/1-Origine_Opentalent-outil_collaboratif_pour_la_culture.jpg',
+      '/images/pages/qui-sommes-nous/chronologie/1-Origine_Opentalent-outil_collaboratif_pour_la_culture.min.jpg',
   },
   {
     year: '2006',
     title: 'Développement et partenariat stratégique',
     description:
-      "Michel, passionné par l'innovation technologique, rejoint Guillaume. Ensemble, ils développent Opentalent avec le soutien de la Fédération de Haute-Savoie. Leur travail acharné bénévole durant 2 ans donne naissance à un logiciel SAS avant-gardiste, une première dans l'univers des structures culturelles.",
+      "Michel, passionné par l'innovation technologique, rejoint Guillaume. Ensemble, ils développent Openassos avec le soutien de l’UFM de Haute-Savoie. Durant 2 ans, ils travaillent bénévolement pour donner naissance à un logiciel SAS avant-gardiste, une première dans l'univers des structures culturelles.",
     imageUrl:
       '/images/pages/qui-sommes-nous/chronologie/2-Developpement_et_partenariat_strategique_Opentalent.jpg',
   },
@@ -126,15 +127,15 @@ const slides: Array<ChronologyItem> = [
     year: '2008',
     title: "Naissance de l'entreprise 2iOpenservice",
     description:
-      "La Fédération de Haute-Savoie, séduite par le projet, invite à collaborer avec la CMF, élargissant l'impact d'Opentalent. 2IOpenservice est alors officiellement créée, marquant une nouvelle ère dans la gestion culturelle digitale.  ",
+      " L’Union des Fédérations Musicales de Haute-Savoie, séduite par le projet, invite à collaborer avec la CMF, élargissant l'impact d’Openassos. 2IOpenservice est alors officiellement créée, marquant une nouvelle ère dans la gestion culturelle digitale.",
     imageUrl:
-      '/images/pages/qui-sommes-nous/chronologie/3-Naissance_de_l_entreprise_2IOpenservice-Opentalent.jpg',
+      '/images/pages/qui-sommes-nous/chronologie/3-logo_2iOpenService.jpg',
   },
   {
     year: '2009',
-    title: 'MusAssos - la réponse aux besoins pour les petites structures',
+    title: 'Musassos pour les petites et moyennes écoles associatives',
     description:
-      'Pour répondre aux besoins spécifiques des écoles affiliées à la CMF, 2iopenservice lance MusAssos, une solution adapté aux petites et moyennes structures, facilitant la gestion et la promotion culturelle.',
+      'Pour répondre aux besoins spécifiques des écoles affiliées à la Confédération Musicale de France (CMF), 2iopenservice lance Musassos une solution adaptée pour les petites et moyennes écoles de musique associatives, facilitant leur gestion et leur promotion culturelle.',
     imageUrl:
       '/images/pages/qui-sommes-nous/chronologie/4-Logiciel_MusAssos-pour_les_petites_et_moyennes_structures.png',
   },
@@ -142,17 +143,17 @@ const slides: Array<ChronologyItem> = [
     year: '2010',
     title: "CMF Réseau <br> l'innovation communautaire",
     description:
-      "La CMF adopte AdminFédé pour connecter ses adhérents, et AdminAsso devient accessible à tous, démocratisant l'accès aux outils de gestion artistique.",
+      "La CMF adopte Adminfédé pour connecter ses adhérents, et Adminassos devient accessible à tous ses adhérents, démocratisant l'accès aux outils de gestion artistique.",
     imageUrl:
       '/images/pages/qui-sommes-nous/chronologie/5-Confédération_Musicale_de_France-CMF_Réseau-AdminFédé_AdminAsso.png',
   },
   {
     year: '2014',
-    title: 'Vers une Culture Multidisciplinaire avec FFEC',
+    title: 'Openassos devient Opentalent ',
     description:
-      "Le logiciel d'Opentalent s'étend au-delà de l'enseignement artistique, embrassant l'art, la musique, le théâtre, la danse et le cirque. En partenariat avec la FFEC, Reso Cirque voit le jour, intégrant notre solution au cœur de la pratique circassienne.",
+      " Le logiciel s'étend au-delà de la musique, embrassant la danse, le théâtre, le crique et l’art. En partenariat avec la Fédération Française des Ecoles de Cirque (FFEC), Reso Cirque voit le jour, intégrant notre solution au cœur de la pratique circassienne. ",
     imageUrl:
-      '/images/pages/qui-sommes-nous/chronologie/6-FFEC_Reso_Cirque-Ouverture_vers_une_culture_multidisciplinaire.png',
+      '/images/pages/qui-sommes-nous/chronologie/Logo_Opentalent_la_plateforme_culturel.jpg',
   },
   {
     year: '2015',
@@ -170,6 +171,13 @@ const slides: Array<ChronologyItem> = [
     imageUrl:
       '/images/pages/qui-sommes-nous/chronologie/8-Nouvelle_generation_Opentalent_moderne_securisee_experience_optimisee.jpg',
   },
+  {
+    year: '2020',
+    title: 'Cap sur sur les conservatoires',
+    description:
+      'La nouvelle gamme Opentalent, représente une étape clé pour l’entreprise, désormais tournée vers les plus grands conservatoires. Des développements spécifiques ont été élaborés pour répondre aux exigences de ce secteur, consolidant ainsi la position d’Opentalent en tant qu’acteur incontournable du domaine culturel.',
+    imageUrl: '/images/pages/qui-sommes-nous/chronologie/Conservatoire.png',
+  },
   {
     year: '2024',
     title: 'Relooking du site Opentalent',
@@ -255,11 +263,11 @@ const slides: Array<ChronologyItem> = [
 
   .image-container,
   .description-container {
-    height: 300px;
-    width: 300px;
+    height: 355px;
+    width: 320px;
 
     @media (max-width: 1480px) {
-      height: 320px;
+      height: 350px;
       width: 260px;
     }
 

components/About/Equipe.vue

@@ -106,12 +106,6 @@ const employees: Array<SocietyMember> = [
       '/images/pages/qui-sommes-nous/equipe/Laetitia_SIFFOINTE-Chargee_de_Marketing_et_Communication.png',
     alt: 'Avatar d’une femme avec les cheveux blonds long et ondulée portant un pull gris et un jean noir',
   },
-  {
-    name: 'Florence',
-    position: 'Assistante administrative et commerciale',
-    photo: '/images/pages/qui-sommes-nous/equipe/Florence_JOANNIDIS-ADV.png',
-    alt: 'Avatar d’une femme avec des lunettes, les cheveux bruns long et attaché portant un pull bleu et un jean bleu foncé',
-  },
   {
     name: 'Vincent',
     position: 'Lead developer',

components/About/Logiciels.vue

@@ -46,6 +46,10 @@
               </footer>
             </v-img>
           </nuxt-link>
+
+          <div class="subtitle">
+            {{ item.subtitle }}
+          </div>
         </v-col>
       </v-row>
     </LayoutContainer>
@@ -72,6 +76,7 @@ const items: Array<{
   logoAlt: string
   class: string
   link: string
+  subtitle: string
 }> = [
   {
     imageUrl:
@@ -82,6 +87,8 @@ const items: Array<{
       'Logo Opentalent Artist - logiciel de gestion et de communication pour les orchestres, les chorales, les compagnies artistiques et troupes',
     class: 'artist',
     link: '/opentalent-artist',
+    subtitle:
+      'Pour les orchestres, les chorales, les compagnies et les troupes artistiques',
   },
   {
     imageUrl:
@@ -92,6 +99,7 @@ const items: Array<{
       'Logo Opentalent School - logiciel de gestion et de communication pour les établissements d’enseignement artistique',
     class: 'school',
     link: '/opentalent-school',
+    subtitle: 'Pour tous les établissements d’enseignement artistique',
   },
   {
     imageUrl:
@@ -102,6 +110,7 @@ const items: Array<{
       'Logo Opentalent Manager - logiciel de gestion et de communication pour les fédérations, les confédérations et les collectivités',
     class: 'manager',
     link: '/opentalent-manager',
+    subtitle: 'Pour les fédérations, confédérations et institutions publiques',
   },
 ]
 </script>
@@ -214,4 +223,10 @@ li:before {
 .manager .plus-button {
   background: var(--manager-color);
 }
+
+.subtitle {
+  margin-top: 12px;
+  text-align: center;
+  font-size: 1rem;
+}
 </style>

components/Common/Banner.vue

@@ -13,8 +13,9 @@
             <v-row>
               <div class="content-row">
                 <img
-                  src="/images/components/banner/Icone_instruments_de_musique_trompette_et_tambour_avec_des_notes_de_musique.svg"
-                  alt="Icône instruments de musique trompette et tambour avec des notes de musique"
+                  v-if="iconSrc !== null"
+                  :src="iconSrc"
+                  alt="Icône instruments de musique"
                   class="custom-icon"
                 />
                 <p class="description">
@@ -72,6 +73,11 @@ defineProps({
     type: Boolean,
     default: false,
   },
+  iconSrc: {
+    type: String as PropType<string | null>,
+    required: false,
+    default: null,
+  },
   reverseImage: {
     type: Boolean,
     default: false,

components/Common/Carousel/Fonctionnalite.client.vue

@@ -1,8 +1,8 @@
 <template>
   <LayoutContainer>
     <v-row class="center-90">
-      <v-col cols="12" md="12">
-        <LayoutUISubTitle>
+      <v-col cols="12">
+        <LayoutUISubTitle class="title">
           Découvrez toutes les fonctionnalités de notre solution
         </LayoutUISubTitle>
 
@@ -105,6 +105,10 @@ h5 {
   text-align: center;
 }
 
+.title {
+  margin-left: -12px;
+}
+
 .v-row {
   width: 95%;
   margin-left: auto;

components/Common/Presentation.vue

@@ -6,7 +6,7 @@ Section "Présentation" d'une page Logiciel
     <v-row class="center-90">
       <!-- Colonne 1 (sous-titre, illustration logiciels, prix) -->
       <v-col cols="12" lg="5">
-        <LayoutUISubTitle class="ml-8">
+        <LayoutUISubTitle>
           {{ title }}
         </LayoutUISubTitle>
 

components/Common/ReviewSection.client.vue

@@ -158,7 +158,7 @@ const goNext = () => {
     }
 
     @media (max-width: 600px) {
-      height: auto;
+      height: 100%;
     }
   }
 

components/Common/Table/Comparatif.vue

@@ -1,188 +1,190 @@
 <template>
   <LayoutContainer>
-    <v-row class="center-90">
-      <table v-if="mdAndUp">
-        <thead>
-          <tr>
-            <th />
-
-            <th>
-              <p class="standard">Standard</p>
-              <p v-if="showFrom" class="from">À partir de</p>
-              <p class="price">
-                {{ standardPrice }} <span class="ttc">ttc</span>
-              </p>
-              <p class="month">/mois *</p>
-            </th>
-
-            <th class="premium-column">
-              <p class="standard">Premium</p>
-              <p v-if="showFrom" class="from">À partir de</p>
-              <p class="price">
-                {{ premiumPrice }} <span class="ttc">ttc</span>
-              </p>
-              <p class="month">/mois *</p>
-            </th>
-          </tr>
-        </thead>
-
-        <tbody>
-          <tr v-for="item in items" :key="item.label">
-            <td class="label-column">
-              {{ item.label }}
-            </td>
-
-            <td>
-              <v-icon
-                v-if="item.includedInStandard === true"
-                icon="far fa-check-circle"
-                size="18"
-              />
-
-              <v-icon
-                v-else-if="item.includedInStandard === false"
-                icon="far fa-times-circle"
-                size="18"
-                color="red"
-              />
-
-              <span v-else>
-                {{ item.includedInStandard }}
-              </span>
-            </td>
-
-            <td>
-              <v-icon
-                v-if="item.includedInPremium === true"
-                icon="far fa-check-circle"
-                size="18"
-              />
-
-              <v-icon
-                v-else-if="item.includedInPremium === false"
-                icon="far fa-times-circle"
-                size="18"
-                color="red"
-              />
-
-              <span v-else>
-                {{ item.includedInPremium }}
-              </span>
-            </td>
-          </tr>
-        </tbody>
-      </table>
-
-      <div v-else>
-        <div class="d-flex flex-row flex-grow-1 justify-center mt-2">
-          <v-btn
-            :disabled="carouselPos === 0"
-            icon="fas fa-chevron-left"
-            class="mr-6"
-            aria-label="Précédent"
-            @click="goToPrevious"
-          />
-          <v-btn
-            :disabled="carouselPos === 1"
-            icon="fas fa-chevron-right"
-            aria-label="Suivant"
-            @click="goToNext"
-          />
+    <div class="premium-container">
+      <v-row class="center-90">
+        <table v-if="mdAndUp">
+          <thead>
+            <tr>
+              <th />
+
+              <th>
+                <p class="standard">Standard</p>
+                <p v-if="showFrom" class="from">À partir de</p>
+                <p class="price">
+                  {{ standardPrice }} <span class="ttc">ttc</span>
+                </p>
+                <p class="month">/mois *</p>
+              </th>
+
+              <th class="premium-column">
+                <p class="standard">Premium</p>
+                <p v-if="showFrom" class="from">À partir de</p>
+                <p class="price">
+                  {{ premiumPrice }} <span class="ttc">ttc</span>
+                </p>
+                <p class="month">/mois *</p>
+              </th>
+            </tr>
+          </thead>
+
+          <tbody>
+            <tr v-for="item in items" :key="item.label">
+              <td class="label-column">
+                {{ item.label }}
+              </td>
+
+              <td>
+                <v-icon
+                  v-if="item.includedInStandard === true"
+                  icon="far fa-check-circle"
+                  size="18"
+                />
+
+                <v-icon
+                  v-else-if="item.includedInStandard === false"
+                  icon="far fa-times-circle"
+                  size="18"
+                  color="red"
+                />
+
+                <span v-else>
+                  {{ item.includedInStandard }}
+                </span>
+              </td>
+
+              <td>
+                <v-icon
+                  v-if="item.includedInPremium === true"
+                  icon="far fa-check-circle"
+                  size="18"
+                />
+
+                <v-icon
+                  v-else-if="item.includedInPremium === false"
+                  icon="far fa-times-circle"
+                  size="18"
+                  color="red"
+                />
+
+                <span v-else>
+                  {{ item.includedInPremium }}
+                </span>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+
+        <div v-else>
+          <div class="d-flex flex-row flex-grow-1 justify-center mt-2">
+            <v-btn
+              :disabled="carouselPos === 0"
+              icon="fas fa-chevron-left"
+              class="mr-6"
+              aria-label="Précédent"
+              @click="goToPrevious"
+            />
+            <v-btn
+              :disabled="carouselPos === 1"
+              icon="fas fa-chevron-right"
+              aria-label="Suivant"
+              @click="goToNext"
+            />
+          </div>
+
+          <v-carousel
+            v-model="carouselPos"
+            :hide-delimiters="true"
+            :show-arrows="false"
+            :height="height"
+          >
+            <v-carousel-item>
+              <h4>Standard</h4>
+              <div>
+                <p class="from">À partir de</p>
+                <p class="price">
+                  {{ standardPrice }} <span class="ttc">ttc</span>
+                  <span class="month">/mois</span>
+                </p>
+              </div>
+
+              <table>
+                <tbody>
+                  <tr v-for="item in items" :key="item.label">
+                    <td class="label-column">
+                      {{ item.label }}
+                    </td>
+
+                    <td>
+                      <v-icon
+                        v-if="item.includedInStandard === true"
+                        icon="far fa-check-circle"
+                        size="18"
+                      />
+
+                      <v-icon
+                        v-else-if="item.includedInStandard === false"
+                        icon="far fa-times-circle"
+                        size="18"
+                        color="red"
+                      />
+
+                      <span v-else>
+                        {{ item.includedInStandard }}
+                      </span>
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </v-carousel-item>
+
+            <v-carousel-item>
+              <h4>Premium</h4>
+
+              <div>
+                <p class="from">À partir de</p>
+                <p class="price">
+                  {{ premiumPrice }} <span class="ttc">ttc</span>
+                  <span class="month">/mois</span>
+                </p>
+              </div>
+
+              <table>
+                <tbody>
+                  <tr v-for="item in items" :key="item.label">
+                    <td class="label-column">
+                      {{ item.label }}
+                    </td>
+
+                    <td>
+                      <v-icon
+                        v-if="item.includedInPremium === true"
+                        icon="far fa-check-circle"
+                        size="18"
+                      />
+
+                      <v-icon
+                        v-else-if="item.includedInPremium === false"
+                        icon="far fa-times-circle"
+                        size="18"
+                        color="red"
+                      />
+
+                      <span v-else>
+                        {{ item.includedInPremium }}
+                      </span>
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </v-carousel-item>
+          </v-carousel>
         </div>
 
-        <v-carousel
-          v-model="carouselPos"
-          :hide-delimiters="true"
-          :show-arrows="false"
-          :height="height"
-        >
-          <v-carousel-item>
-            <h4>Standard</h4>
-            <div>
-              <p class="from">À partir de</p>
-              <p class="price">
-                {{ standardPrice }} <span class="ttc">ttc</span>
-                <span class="month">/mois</span>
-              </p>
-            </div>
-
-            <table>
-              <tbody>
-                <tr v-for="item in items" :key="item.label">
-                  <td class="label-column">
-                    {{ item.label }}
-                  </td>
-
-                  <td>
-                    <v-icon
-                      v-if="item.includedInStandard === true"
-                      icon="far fa-check-circle"
-                      size="18"
-                    />
-
-                    <v-icon
-                      v-else-if="item.includedInStandard === false"
-                      icon="far fa-times-circle"
-                      size="18"
-                      color="red"
-                    />
-
-                    <span v-else>
-                      {{ item.includedInStandard }}
-                    </span>
-                  </td>
-                </tr>
-              </tbody>
-            </table>
-          </v-carousel-item>
-
-          <v-carousel-item>
-            <h4>Premium</h4>
-
-            <div>
-              <p class="from">À partir de</p>
-              <p class="price">
-                {{ premiumPrice }} <span class="ttc">ttc</span>
-                <span class="month">/mois</span>
-              </p>
-            </div>
-
-            <table>
-              <tbody>
-                <tr v-for="item in items" :key="item.label">
-                  <td class="label-column">
-                    {{ item.label }}
-                  </td>
-
-                  <td>
-                    <v-icon
-                      v-if="item.includedInPremium === true"
-                      icon="far fa-check-circle"
-                      size="18"
-                    />
-
-                    <v-icon
-                      v-else-if="item.includedInPremium === false"
-                      icon="far fa-times-circle"
-                      size="18"
-                      color="red"
-                    />
-
-                    <span v-else>
-                      {{ item.includedInPremium }}
-                    </span>
-                  </td>
-                </tr>
-              </tbody>
-            </table>
-          </v-carousel-item>
-        </v-carousel>
-      </div>
-
-      <div class="asterisk">
-        <span>* Payable annuellement</span>
-      </div>
-    </v-row>
+        <div class="asterisk">
+          <span>* Payable annuellement</span>
+        </div>
+      </v-row>
+    </div>
   </LayoutContainer>
 </template>
 
@@ -359,4 +361,46 @@ td:first-child {
   justify-content: flex-end;
   font-style: italic;
 }
+
+table tr th:nth-child(3),
+table tr td:nth-child(3) {
+  border-left: 2px solid black;
+  border-right: 2px solid black;
+  width: 15rem;
+  border-radius: 50px;
+  padding: 1rem;
+  position: relative;
+}
+table tr:nth-child(1) th:nth-child(3) {
+  border-bottom: none !important;
+}
+
+.premium-column {
+  position: relative;
+  z-index: 10;
+  border-radius: 0 15px 15px 0;
+}
+
+.premium-column p,
+.premium-column .month,
+.premium-column .price {
+  border: none !important;
+}
+
+thead th:nth-child(3) {
+  border-top: 2px solid black;
+}
+
+tbody tr:last-child td:nth-child(3) {
+  border-bottom: 2px solid black;
+  border-radius: 0 0 15px 0;
+}
+
+.premium-column p,
+.premium-column .month,
+.premium-column .price,
+.premium-column .ttc {
+  margin: 0;
+  padding: 0;
+}
 </style>

components/Contact/Form.vue

@@ -193,9 +193,9 @@
         l’exécution des contrats. Conformément à la loi "Informatique et
         Libertés du 6 Janvier 1978", vous disposez d’un droit d’accès, de
         modifications, de rectification et de suppression des données vous
-        concernant. Pour toute demande, adressez-vous à : Opentalent, 265, rue de la Grange, 
-        74950 SCIONZIER, opentalent.fr s’engage à la
-        confidentialité et à la protection de vos données.
+        concernant. Pour toute demande, adressez-vous à : OPENTALENT, 265 rue de
+        la Grange 74950 SCIONZIER - FRANCE, opentalent.fr s’engage à la
+        confidentialité et à la protection de vos données.”
       </div>
     </v-form>
 

components/Contact/Map.client.vue

@@ -71,7 +71,7 @@ import 'leaflet/dist/leaflet.css'
 import { LMap, LTileLayer, LMarker } from '@vue-leaflet/vue-leaflet'
 import L from 'leaflet'
 
-const location = [46.055, 6.55];
+const location = [46.055, 6.55]
 
 // eslint-disable-next-line import/no-named-as-default-member
 const icon = L.icon({

components/Formation/Qualite.vue

@@ -53,6 +53,6 @@ import AnchoredSection from '~/components/Layout/AnchoredSection.vue'
 
 .card {
   color: var(--on-alt-theme) !important;
-  background: var(--primary-color);
+  background: var(--primary-color) !important;
 }
 </style>

components/Home/Caroussel.vue

@@ -10,7 +10,7 @@ Carrousel de la page d'accueil
       :hide-delimiter-background="true"
       :show-delimiters="false"
       :touch="true"
-      :height="lgAndUp ? 500 : 800"
+      :height="lgAndUp ? 500 : 600"
       :interval="10000"
       :cycle="true"
     >

components/Home/Promotion.vue

@@ -66,7 +66,10 @@
           aria-description="Vidéo corporate Opentalent : découvrez l’histoire de l’entreprise, son agenda et ses logiciels culturels"
         >
           <source
-            src="/storage/Video_Corporate_Opentalent-Agenda_et_logiciels_culturels.mp4"
+            :src="
+              runtimeConfig.public.fileStorageBaseUrl +
+              '/Video_Corporate_Opentalent-Agenda_et_logiciels_culturels.mp4'
+            "
             type="video/mp4"
           />
         </video>
@@ -140,6 +143,8 @@
 </template>
 
 <script setup lang="ts">
+const runtimeConfig = useRuntimeConfig()
+
 const playVideo: Ref<boolean> = ref(false)
 </script>
 
@@ -154,7 +159,7 @@ const playVideo: Ref<boolean> = ref(false)
     background: var(--primary-color);
 
     @media (max-width: 600px) {
-      min-height: 430px;
+      min-height: 550px;
       padding: 0 5%;
     }
   }

components/Home/Reviews.client.vue

@@ -1,5 +1,5 @@
 <template>
-  <LayoutContainer>
+  <LayoutContainer class="main-container">
     <div class="container-1">
       <LayoutUISectionTitle> Avis Clients </LayoutUISectionTitle>
 
@@ -268,10 +268,12 @@ const items: Ref<Array<{ src: string; alt: string }>> = ref([
 ])
 </script>
 
-<style scoped>
-.container-1 {
+<style scoped lang="scss">
+.main-container {
   background-color: var(--neutral-color-alt-light);
+}
 
+.container-1 {
   @media (min-width: 1240px) {
     height: 22rem;
   }
@@ -283,11 +285,15 @@ const items: Ref<Array<{ src: string; alt: string }>> = ref([
     color: var(--primary-color);
   }
 
-  @media (max-width: 600px) {
-    margin-bottom: 24px;
+  @media (max-width: 900px) {
+    padding-bottom: 24px;
   }
 }
 
+.v-card {
+  height: 100%;
+}
+
 .container-2 {
   background-color: var(--primary-color);
 
@@ -372,6 +378,8 @@ const items: Ref<Array<{ src: string; alt: string }>> = ref([
 }
 
 .container-sm {
+  background-color: var(--primary-color);
+
   .v-card {
     width: 70%;
     display: flex;

components/Layout/FAQ.vue

@@ -1,23 +1,21 @@
 <template>
   <div class="alt-theme main my-2">
+    <div class="center-90">
+      <v-row class="subtitle">
+        <v-col cols="12">
+          <LayoutUISubTitle class="mt-12 ml-3">
+            Vous voulez tirer le meilleur de notre logiciel ?
+          </LayoutUISubTitle>
+        </v-col>
+      </v-row>
+    </div>
+
     <v-row>
       <v-col cols="12" lg="6">
-        <LayoutUISubTitle class="mt-12 ml-3">
-          Vous voulez tirer le meilleur de notre logiciel ?
-        </LayoutUISubTitle>
-
-        <h3 class="mt-6">
+        <h3 class="mt-12">
           Quelle que soit votre demande, notre équipe est à vos côtés pour vous
           guider
         </h3>
-
-        <v-btn
-          href="https://ressources.opentalent.fr/"
-          target="_blank"
-          class="btn-faq inv-theme"
-        >
-          Consulter notre FAQ
-        </v-btn>
       </v-col>
 
       <v-col cols="12" lg="6" class="links">
@@ -65,8 +63,12 @@
   max-width: 100%;
 }
 
+.subtitle {
+  width: 100%;
+}
+
 .main {
-  min-height: 600px;
+  min-height: 450px;
   background-image: url('/images/components/faq/Orchestre_de_rue_avec_danseuse.jpg');
   background-size: cover;
   background-position: center 15%;

components/Layout/Footer/Footer.vue

@@ -217,7 +217,7 @@
         </v-row>
 
         <v-row class="mb-3" justify="center">
-          <p>2024 © Opentalent est une marque déposée par 2iOPENservice</p>
+          <p>Crédit : © 2024 Opentalent - Tous droits réservés</p>
         </v-row>
       </div>
     </LayoutContainer>

components/Layout/Navigation/Md.vue

@@ -152,6 +152,10 @@ const withAnimation = (callback: () => void) => {
   max-width: 100vw;
 }
 
+:deep(.v-app-bar-title) {
+  margin-inline-start: 0 !important;
+}
+
 .navigation-sm {
   background-color: var(--neutral-color);
   position: fixed;

components/Logiciels/Artist/Comparatif.vue

@@ -1,10 +1,18 @@
 <template>
   <AnchoredSection id="comparative">
-    <LayoutContainer>
-      <LayoutUISubTitle> Comparatif de nos solutions </LayoutUISubTitle>
+    <v-row class="center-90">
+      <v-col cols="12">
+        <LayoutUISubTitle class="subtitle">
+          Comparatif de nos solutions
+        </LayoutUISubTitle>
 
-      <LayoutUITitle> Choisissez la version qui vous convient ! </LayoutUITitle>
+        <LayoutUITitle>
+          Choisissez la version qui vous convient !
+        </LayoutUITitle>
+      </v-col>
+    </v-row>
 
+    <LayoutContainer class="wrapper">
       <CommonTableComparatif
         standard-price="11€"
         premium-price="18€"
@@ -88,7 +96,11 @@ const comparisonItems: Array<ComparisonItem> = [
 </script>
 
 <style scoped>
-.v-container {
+.subtitle {
+  margin-left: -12px;
+}
+
+.wrapper {
   width: 95%;
   margin-right: auto;
   margin-left: auto;

components/Logiciels/Artist/SomeNumbers.vue

@@ -1,7 +1,9 @@
 <template>
   <LayoutContainer>
-    <v-row class="custom-row">
-      <LayoutUISubTitle class="mb-12"> Quelques chiffres </LayoutUISubTitle>
+    <v-row class="center-90">
+      <v-col cols="12">
+        <LayoutUISubTitle class="mb-12"> Quelques chiffres </LayoutUISubTitle>
+      </v-col>
     </v-row>
 
     <v-container>

components/Logiciels/Title.vue

@@ -41,6 +41,7 @@ h1 {
   line-height: 77px;
   color: var(--on-neutral-color);
   text-align: center;
+  white-space: nowrap;
 
   @media (max-width: 600px) {
     font-size: 42px;

components/News/List.client.vue

@@ -31,8 +31,8 @@
               <v-col cols="12" lg="9">
                 <div class="details">
                   <NuxtLink
-                  :to="`/actualites/${newsItem.id}-${newsItem.slug}`"                    
-                  class="text-decoration-none"
+                    :to="`/actualites/${newsItem.id}-${newsItem.slug}`"
+                    class="text-decoration-none"
                   >
                     <v-card-title>
                       {{ newsItem.title }}

components/Webinaire/Catalogue.vue

@@ -208,7 +208,7 @@ const courses: Array<Training> = [
       "Ces webinaires sont spécialement conçus pour les utilisateurs du logiciel fédéral de la Confédération Musicale de France. Gagnez en temps administratif, boostez vos performances et optimisez l'utilisation du logiciel.",
     objectives: [
       "Paramétrer et gérer le suivi l'appel à cotisation (suivi, relance, facture, saisie des règlements)",
-      "Transmission des sommes à votre fédération parente",
+      'Transmission des sommes à votre fédération parente',
       'Gérer les membres du CA et les structures adhérentes (entrées, sorties, coordonnées, mots de passe ...)',
       'Communiquer avec son réseau',
     ],

nuxt.config.ts

@@ -110,6 +110,7 @@ export default defineNuxtConfig({
     '@nuxtjs/google-fonts',
     '@nuxtjs/sitemap',
     'nuxt-gtag',
+    'nuxt-vitalizer',
   ],
   router: {
     options: {

package.json

@@ -43,6 +43,7 @@
     "nuxt": "^3.11.2",
     "nuxt-gtag": "^2.0.6",
     "nuxt-lodash": "^2.5.3",
+    "nuxt-vitalizer": "^0.10.0",
     "nuxt3-leaflet": "^1.0.12",
     "ofetch": "^1.3.3",
     "pinia": "^2.1.7",

pages/actualites/[id]-[slug].vue

@@ -1,5 +1,10 @@
 <template>
   <div>
+    <CommonMeta
+      title="Actualité de l'éditeur de logiciel de gestion et de communication Opentalent"
+      description="Suivez l’actualité d’Opentalent : événements incontournables, opportunité de carrières et innovations logicielles. Suivez-nous et faites partie de l'évolution culturelle."
+    />
+
     <LayoutUITitlePage>
       Actualités
       <template #subtitle

pages/formations.vue

@@ -13,7 +13,7 @@
     </LayoutUITitlePage>
 
     <CommonBanner
-      image-src="/images/pages/formations/banner/Formations_Opentalent.webp"
+      image-src="/images/pages/formations/banner/Formations_Opentalent.jpg"
       image-alt="Formation dans une salle de réunion ou 5 personnes regardent un écran"
     />
 

pages/mentions-legales.vue

@@ -27,7 +27,7 @@
           <p>
             2iOPENservice <br />
             SARL au capital de 46 050,00 €<br />
-            SIRET : n°504 653 122 000 52 | TVA n°FR62504653122<br />
+            SIRET : n°504 653 122 000 60 | TVA n°FR62504653122<br />
             Siège social : 265, rue de la Grange - 74950 SCIONZIER - FRANCE<br />
             Téléphone : 09 72 12 60 17<br />
             Mail : contact@opentalent.fr<br />

pages/opentalent-artist.vue

@@ -20,6 +20,7 @@
         square-text="Orchestres, chorales, compagnies et troupes artistiques"
         logo-src="/images/logos/opentalent/Logo_Opentalent_Artist-gris.png"
         logo-alt="Logo Opentalent Artist - logiciel de gestion et de communication pour les orchestres, les chorales, les compagnies artistiques et troupes"
+        icon-src="/images/components/banner/Icone_instruments_de_musique_trompette_et_tambour_avec_des_notes_de_musique.svg"
       />
 
       <CommonMenuScroll v-if="lgAndUp" :menus="menus" class="mb-6" />

pages/opentalent-manager.vue

@@ -18,6 +18,7 @@
         square-text="Fédérations, confédérations et collectivités"
         logo-src="/images/logos/opentalent/Logo_Opentalent_Manager-gris.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"
+        icon-src="/images/pages/opentalent_manager/banner/Icone_mise_en_reseau.svg"
       />
 
       <CommonMenuScroll v-if="lgAndUp" :menus="menus" class="mb-6" />

pages/opentalent-school.vue

@@ -18,6 +18,7 @@
         square-text="Écoles de musique, de danse, de théâtre, d'art, de cirque, conservatoires et MJC"
         logo-src="/images/logos/opentalent/Logo_Opentalent_School-blanc.png"
         logo-alt="Logo Opentalent School - logiciel de gestion et de communication pour les établissements d’enseignement artistique"
+        icon-src="/images/components/banner/Icône_instruments_de_musique_guitare_micro_flute_tambourin_et_casque_de_musique.svg"
         :logo-alt-theme="true"
       />
 

yarn.lock

@@ -9506,6 +9506,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"nuxt-vitalizer@npm:^0.10.0":
+  version: 0.10.0
+  resolution: "nuxt-vitalizer@npm:0.10.0"
+  dependencies:
+    "@nuxt/kit": "npm:^3.12.2"
+    defu: "npm:^6.1.4"
+    knitwork: "npm:^1.1.0"
+  checksum: 10c0/228ea512010178291837d4f98f8d124cdf22068fba65982a4b47b21cdd4aa1fa46ef74777853723633476ed5b0309468b02af350bb42c0b189c91d4d38c22d1d
+  languageName: node
+  linkType: hard
+
 "nuxt3-leaflet@npm:^1.0.12":
   version: 1.0.13
   resolution: "nuxt3-leaflet@npm:1.0.13"
@@ -11439,6 +11450,7 @@ __metadata:
     nuxt: "npm:^3.11.2"
     nuxt-gtag: "npm:^2.0.6"
     nuxt-lodash: "npm:^2.5.3"
+    nuxt-vitalizer: "npm:^0.10.0"
     nuxt3-leaflet: "npm:^1.0.12"
     ofetch: "npm:^1.3.3"
     pinia: "npm:^2.1.7"