various fixes

components/About/Valeurs.vue

@@ -96,6 +96,11 @@ const values: Array<Array<SocietyValue>> = [
   @media (max-width: 1240px) {
     width: 90%;
   }
+
+  @media (max-width: 600px) {
+    height: auto;
+    width: auto;
+  }
 }
 
 .values {

components/Formation/Catalogue.vue

@@ -2,7 +2,6 @@
   <AnchoredSection id="catalog">
     <LayoutContainer>
       <v-row class="background-block">
-
         <v-row class="center-90">
           <LayoutUISubTitle>
             Découvrez notre catalogue de formation
@@ -12,7 +11,12 @@
         </v-row>
 
         <v-row class="center-90 catalog">
-          <v-col v-for="(course, index) in courses" :key="index" cols="12" lg="4">
+          <v-col
+            v-for="(course, index) in courses"
+            :key="index"
+            cols="12"
+            lg="4"
+          >
             <v-card class="mb-4">
               <v-card-text>
                 <div class="title-card-container">
@@ -128,8 +132,7 @@ const courses: Array<Training> = [
       },
     ],
     price: '2 008,80€ TTC',
-    downloadLink:
-      'files/PF-School-2024-02_2-jours.pdf',
+    downloadLink: 'files/PF-School-2024-02_2-jours.pdf',
   },
   {
     number: '02',
@@ -153,8 +156,7 @@ const courses: Array<Training> = [
       },
     ],
     price: '1004,40€ TTC',
-    downloadLink:
-      'files/PF-School-2024-02_1-jour.pdf',
+    downloadLink: 'files/PF-School-2024-02_1-jour.pdf',
   },
   {
     number: '03',
@@ -179,20 +181,18 @@ const courses: Array<Training> = [
       },
     ],
     price: '1004,40€ TTC',
-    downloadLink:
-      'files/PF-Typo3-2024-02_1-jour.pdf',
+    downloadLink: 'files/PF-Typo3-2024-02_1-jour.pdf',
   },
 ]
 </script>
 
 <style scoped lang="scss">
-.background-block{
+.background-block {
   background: var(--neutral-color-alt-light);
   padding: 4rem;
 }
 
 .catalog {
-
   @media (max-width: 600px) {
     padding: 0.5rem;
   }
@@ -230,6 +230,10 @@ const courses: Array<Training> = [
     margin-top: 1rem;
     margin-bottom: 0.5rem;
     height: 5rem;
+
+    @media (max-width: 600px) {
+      height: auto;
+    }
   }
 
   .objectives,
@@ -285,6 +289,17 @@ const courses: Array<Training> = [
     display: flex;
     justify-content: center;
     align-items: center;
+
+    @media (max-width: 600px) {
+      height: 42px;
+
+      :deep(.v-chip__content) {
+        max-width: 100%;
+        overflow-wrap: break-word;
+        white-space: break-spaces;
+        text-align: center;
+      }
+    }
   }
 }
 </style>

components/Formation/OPCA.vue

@@ -2,7 +2,7 @@
   <AnchoredSection id="financing">
     <LayoutContainer class="alt-theme py-6 my-6">
       <v-row class="center-90">
-        <LayoutUISubTitle> Financement des formations </LayoutUISubTitle>
+        <LayoutUISubTitle class="ml-4"> Financement des formations </LayoutUISubTitle>
       </v-row>
 
       <v-container>
@@ -16,7 +16,7 @@
             />
           </v-col>
 
-          <v-col cols="12" md="6">
+          <v-col cols="12" md="6" class="col-details">
             <v-row>
               <h3 class="mt-6 mb-6 mr-6">
                 Des formations éligibles par votre OPCA
@@ -75,6 +75,10 @@ h3 {
   margin-top: 0.6rem;
 }
 
+.col-details {
+  max-width: 550px;
+}
+
 .details-opca {
   font-size: 16px;
   line-height: 20px;

components/Logiciels/Artist/Formations.vue

@@ -25,9 +25,9 @@
               <p class="details">
                 Rejoignez notre webinaire, spécialement conçu pour les
                 professionnels du secteur culturel : orchestres, chorales,
-                compagnies de danse, troupes de théâtre et de
-                cirque. Cette session interactive vous offre une occasion unique
-                de vous immerger dans les fonctionnalités de notre logiciel, de
+                compagnies de danse, troupes de théâtre et de cirque. Cette
+                session interactive vous offre une occasion unique de vous
+                immerger dans les fonctionnalités de notre logiciel, de
                 comprendre ses avantages distinctifs et d'explorer les diverses
                 versions disponibles. Ne manquez pas cette chance de simplifier
                 votre gestion et de faire évoluer votre pratique artistique avec

components/Webinaire/Catalogue.vue

@@ -2,27 +2,32 @@
   <LayoutContainer>
     <div>
       <v-row class="background-block">
-
         <v-row class="center-90">
           <LayoutUISubTitle> Des webinaires pour tous </LayoutUISubTitle>
         </v-row>
 
         <v-row class="center-90">
           <v-col cols="12" class="section-title">
-            <h3>Simplifiez la gestion et la communication de votre structure</h3>
+            <h3>
+              Simplifiez la gestion et la communication de votre structure
+            </h3>
 
             <div class="strong-label">
-              Votre structure culturelle, établissement d’enseignement artistique
-              ou fédération mérite les outils les plus performants du marché pour
-              briller en toute simplicité. Découvrez comment nos outils peuvent
-              transformer votre quotidien :
+              Votre structure culturelle, établissement d’enseignement
+              artistique ou fédération mérite les outils les plus performants du
+              marché pour briller en toute simplicité. Découvrez comment nos
+              outils peuvent transformer votre quotidien :
             </div>
           </v-col>
         </v-row>
 
-
         <v-row class="center-90 catalog">
-          <v-col v-for="(course, index) in courses" :key="index" cols="12" md="4">
+          <v-col
+            v-for="(course, index) in courses"
+            :key="index"
+            cols="12"
+            md="4"
+          >
             <v-card class="mb-4">
               <v-card-text>
                 <div class="title-card-container">
@@ -42,8 +47,8 @@
 
                   <ul>
                     <li
-                        v-for="(objective, objIndex) in course.objectives"
-                        :key="objIndex"
+                      v-for="(objective, objIndex) in course.objectives"
+                      :key="objIndex"
                     >
                       {{ objective }}
                     </li>
@@ -57,14 +62,14 @@
 
                   <v-row>
                     <v-col
-                        v-for="column in course.additionalObjectives"
-                        :key="column.id"
-                        cols="6"
+                      v-for="column in course.additionalObjectives"
+                      :key="column.id"
+                      cols="6"
                     >
                       <ul>
                         <li
-                            v-for="(objective, objIndex) in column.objectives"
-                            :key="objIndex"
+                          v-for="(objective, objIndex) in column.objectives"
+                          :key="objIndex"
                         >
                           {{ objective }}
                         </li>
@@ -96,18 +101,15 @@
       class="calendar-modal"
     >
       <v-card
-        title="Inscrivez vous"
-        class="d-flex flex-column align-center  alt-theme"
+        title="Inscrivez-vous"
+        class="d-flex flex-column align-center alt-theme"
       >
         <v-card-text>
           <h4 class="title-inscription text-center mt-4">
             Vous y êtes presque !
           </h4>
 
-          <iframe
-            :src="webinaireCalendars[selectedWebinar]"
-            height="700"
-          />
+          <iframe :src="webinaireCalendars[selectedWebinar]" height="700" />
         </v-card-text>
 
         <v-card-actions>
@@ -281,7 +283,7 @@ const closeModal = () => {
   }
 }
 
-.background-block{
+.background-block {
   background: var(--neutral-color-alt-light);
   padding: 4rem;
 }
@@ -381,7 +383,7 @@ const closeModal = () => {
   h4 {
     font-weight: 600;
     font-size: 2rem;
-    line-height: 18px;
+    line-height: 32px;
     margin-bottom: 2rem;
   }