Maha Bouchiba пре 2 година
родитељ
комит
d6fc02c531
69 измењених фајлова са 1502 додато и 1633 уклоњено
  1. 0 0
      .gitlab-ci.yml
  2. 9 0
      .prettierrc
  3. 3 3
      README.md
  4. 2 8
      app.vue
  5. 18 20
      components/About/Banner.vue
  6. 9 10
      components/About/Histoire.vue
  7. 18 22
      components/About/Logiciels.vue
  8. 12 13
      components/About/Valeurs.vue
  9. 27 29
      components/Formation/Banner.vue
  10. 26 29
      components/Formation/Catalogue.vue
  11. 2 3
      components/Formation/Certification.vue
  12. 33 36
      components/Formation/FAQ.vue
  13. 23 25
      components/Formation/Participation.vue
  14. 76 133
      components/Formation/Solutions.vue
  15. 3 3
      components/Home/Caroussel.vue
  16. 4 4
      components/Home/Help.vue
  17. 9 6
      components/Home/Promotion.vue
  18. 0 1
      components/Home/Reviews.vue
  19. 33 34
      components/Home/Solution.vue
  20. 0 3
      components/JoinUs/Banner.vue
  21. 11 14
      components/JoinUs/Missions.vue
  22. 3 3
      components/Layout/Container.vue
  23. 2 11
      components/Layout/FAQ.vue
  24. 18 19
      components/Layout/Footer.vue
  25. 18 15
      components/Layout/Navigation.vue
  26. 1 1
      components/Logiciels/Artist/Avantages.vue
  27. 7 14
      components/Logiciels/Artist/Banner.vue
  28. 33 36
      components/Logiciels/Artist/FAQ.vue
  29. 2 2
      components/Logiciels/Artist/Fonctionnalites.vue
  30. 21 23
      components/Logiciels/Artist/MenuScroll.vue
  31. 111 113
      components/Logiciels/Artist/Outil.vue
  32. 2 2
      components/Logiciels/Artist/Premium.vue
  33. 12 13
      components/Logiciels/Artist/Projet.vue
  34. 35 37
      components/Logiciels/Artist/Reviews.vue
  35. 78 135
      components/Logiciels/Artist/Solutions.vue
  36. 1 1
      components/Logiciels/Manager/Agenda.vue
  37. 59 58
      components/Logiciels/Manager/Avantages.vue
  38. 4 6
      components/Logiciels/Manager/Banner.vue
  39. 33 36
      components/Logiciels/Manager/FAQ.vue
  40. 150 141
      components/Logiciels/Manager/Fonctionnalites.vue
  41. 8 10
      components/Logiciels/Manager/MenuScroll.vue
  42. 145 146
      components/Logiciels/Manager/Outil.vue
  43. 9 10
      components/Logiciels/Manager/Projet.vue
  44. 54 55
      components/Logiciels/Manager/Pyramide.vue
  45. 35 37
      components/Logiciels/Manager/Reviews.vue
  46. 1 2
      components/Logiciels/School/Avantages.vue
  47. 1 4
      components/Logiciels/School/Banner.vue
  48. 7 7
      components/Logiciels/School/Caroussel.vue
  49. 2 2
      components/Logiciels/School/Fonctionnalites.vue
  50. 0 2
      components/Logiciels/School/MenuScroll.vue
  51. 2 2
      components/Logiciels/School/Outil.vue
  52. 0 1
      components/Logiciels/School/Premium.vue
  53. 14 11
      components/Logiciels/School/Projet.vue
  54. 35 37
      components/Logiciels/School/Reviews.vue
  55. 78 135
      components/Logiciels/School/Solutions.vue
  56. 44 0
      eslintrc.js
  57. 1 2
      lang/fr.json
  58. 5 2
      nuxt.config.ts
  59. 4 4
      package.json
  60. 5 7
      pages/about.vue
  61. 3 5
      pages/formation.vue
  62. 8 8
      pages/index.vue
  63. 2 4
      pages/join.vue
  64. 6 6
      pages/logiciels/artist.vue
  65. 5 5
      pages/logiciels/manager.vue
  66. 7 7
      pages/logiciels/school.vue
  67. 14 15
      plugins/vuetify.ts
  68. 3 8
      tsconfig.json
  69. 96 37
      yarn.lock

+ 0 - 0
.gitlab-ci.yml


+ 9 - 0
.prettierrc

@@ -0,0 +1,9 @@
+{
+  "name": "mon-projet",
+  "version": "1.0.0",
+  "prettier": {
+    "tabWidth": 2,
+    "singleQuote": true,
+    "semi": false
+  }
+}

+ 3 - 3
README.md

@@ -6,7 +6,7 @@ Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introdu
 
 Make sure to install the dependencies:
 
-```bash
+````bash
 # yarn
 yarn install
 
@@ -16,12 +16,12 @@ Start the development server on http://localhost:3000
 
 ```bash
 yarn dev
-```
+````
 
 ## SSG
+
 ```bash
 yarn generate
 ```
 
 Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
-

+ 2 - 8
app.vue

@@ -1,11 +1,5 @@
 <template>
-
-
-       <nuxt-page />
-
+  <nuxt-page />
 </template>
 
-<script setup lang="ts">
-
-</script>
-
+<script setup lang="ts"></script>

+ 18 - 20
components/About/Banner.vue

@@ -1,9 +1,9 @@
 <template>
   <LayoutContainer>
     <v-row>
-        <v-col cols="12" class="title">
-          <h1 class="text-center">Qui sommes nous ?</h1>
-        </v-col>
+      <v-col cols="12" class="title">
+        <h1 class="text-center">Qui sommes nous ?</h1>
+      </v-col>
     </v-row>
 
     <v-row>
@@ -14,8 +14,6 @@
             alt="line"
             class="cover-image"
           />
-  
-
         </div>
       </v-col>
     </v-row>
@@ -23,7 +21,9 @@
     <v-row>
       <v-col cols="12" class="menu-container">
         <div v-for="menu in menus" :key="menu.label">
-          <v-chip v-if="state.activeMenu === menu.label" class="active-menu">{{ menu.label }}</v-chip>
+          <v-chip v-if="state.activeMenu === menu.label" class="active-menu">{{
+            menu.label
+          }}</v-chip>
           <span v-else>{{ menu.label }}</span>
         </div>
       </v-col>
@@ -34,29 +34,27 @@
 <script setup>
 const state = ref({
   activeMenu: "Qui sommes-nous",
-})
+});
 
 const menus = [
-  { label: 'Qui sommes-nous' },
-  { label: 'nos logiciels' },
-  { label: 'l\’agenda opentalent' },
-  { label: 'notre histoire' },
-  { label: 'notre équipe' }
+  { label: "Qui sommes-nous" },
+  { label: "nos logiciels" },
+  { label: "l\’agenda opentalent" },
+  { label: "notre histoire" },
+  { label: "notre équipe" },
 ];
 </script>
 
-
 <style scoped>
-
-.title{
+.title {
   margin-top: 2rem;
   margin-bottom: 2rem;
   text-align: center;
-  font-family: 'Barlow';
-font-style: normal;
-font-weight: 600;
-font-size: 3rem;
-line-height: 85px;
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 600;
+  font-size: 3rem;
+  line-height: 85px;
 }
 
 .container-title {

+ 9 - 10
components/About/Histoire.vue

@@ -61,7 +61,6 @@
 <script setup></script>
 
 <style scoped>
-
 .culture-details {
   font-family: "Barlow";
   font-style: normal;
@@ -72,15 +71,15 @@
   width: 30rem;
 }
 
-.culture-title{
-  font-family: 'Barlow';
-font-style: normal;
-font-weight: 400;
-font-size: 34px;
-line-height: 38px;
-color: #071B1F;
-margin-bottom: 3rem;
-width:25rem;
+.culture-title {
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 400;
+  font-size: 34px;
+  line-height: 38px;
+  color: #071b1f;
+  margin-bottom: 3rem;
+  width: 25rem;
 }
 .passion-title {
   font-family: "Barlow";

+ 18 - 22
components/About/Logiciels.vue

@@ -1,12 +1,9 @@
 <template>
   <LayoutContainer :overflow="false">
     <div class="container-title">
-      <p class=" solution-subtitle">ce qui nous anime</p>
-    <h3 class="title">
-      Nos Logiciels
-    </h3>
+      <p class="solution-subtitle">ce qui nous anime</p>
+      <h3 class="title">Nos Logiciels</h3>
     </div>
- 
 
     <v-row>
       <v-col cols="3" class="col-info">
@@ -279,7 +276,7 @@
   font-size: 0.9rem;
   line-height: 0.9rem;
   margin-top: 1rem;
-  color: #0E2D32;
+  color: #0e2d32;
 }
 
 .logiciel-name {
@@ -288,7 +285,7 @@
   font-weight: 400;
   font-size: 30px;
   line-height: 2rem;
-  color: #0E2D32;
+  color: #0e2d32;
   margin-bottom: 1rem;
 }
 
@@ -300,7 +297,7 @@
   line-height: 15px;
   letter-spacing: 0.18em;
   text-transform: uppercase;
-  color: #0E2D32;
+  color: #0e2d32;
 }
 .title {
   font-family: "Barlow";
@@ -308,33 +305,32 @@
   font-weight: 00;
   font-size: 2rem;
   line-height: 42px;
-  color: #0E2D32;
+  color: #0e2d32;
   margin-bottom: 3rem;
 }
 
 .solution-subtitle {
-  font-family: 'Barlow';
-font-style: normal;
-font-weight: 600;
-font-size: 10px;
-line-height: 15px;
-display: flex;
-align-items: center;
-letter-spacing: 0.18em;
-text-transform: uppercase;
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 600;
+  font-size: 10px;
+  line-height: 15px;
+  display: flex;
+  align-items: center;
+  letter-spacing: 0.18em;
+  text-transform: uppercase;
 
-color: #071B1F;
+  color: #071b1f;
 }
 .container {
-  margin-bottom: 20rem;;
+  margin-bottom: 20rem;
   height: 30rem;
   position: relative;
 }
 
-.container-title{
+.container-title {
   margin-top: 5rem;
   margin-left: 8rem;
   margin-bottom: 5rem;
 }
-
 </style>

+ 12 - 13
components/About/Valeurs.vue

@@ -87,25 +87,24 @@
 
 <script setup></script>
 <style scoped>
-
-.row{
-  border-top: 1px solid #E5E5E5;
+.row {
+  border-top: 1px solid #e5e5e5;
 }
-.icon{
-  color: #F4AA2A;
+.icon {
+  color: #f4aa2a;
   font-size: 1.5rem;
   font-weight: 900;
   margin-bottom: 1rem;
 }
 
-.title-valeurs{
-  font-family: 'Barlow';
-font-style: normal;
-font-weight: 500;
-font-size: 22px;
-line-height: 26px;
-color: #091D20;
-margin-bottom: 1rem;
+.title-valeurs {
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 500;
+  font-size: 22px;
+  line-height: 26px;
+  color: #091d20;
+  margin-bottom: 1rem;
 }
 .title-valeur {
   font-family: "Barlow";

+ 27 - 29
components/Formation/Banner.vue

@@ -1,19 +1,21 @@
 <template>
   <LayoutContainer>
     <div class="container-title">
-      <v-col cols="12" >
+      <v-col cols="12">
         <h1 class="formation">Formation</h1>
-        <h4 class="subtitle-formation">Prise en main ou piqûre de rappel, on est toujours à vos côtés.</h4>
+        <h4 class="subtitle-formation">
+          Prise en main ou piqûre de rappel, on est toujours à vos côtés.
+        </h4>
       </v-col>
     </div>
 
     <v-row>
       <v-col cols="12">
-          <img
-            src="/images/formation/banner.jpg"
-            alt="line"
-            class="cover-image"
-          />
+        <img
+          src="/images/formation/banner.jpg"
+          alt="line"
+          class="cover-image"
+        />
       </v-col>
     </v-row>
 
@@ -41,33 +43,32 @@ const menus = [
   { label: "FINANCEMENT" },
   { label: "CERTIFICATION" },
   { label: "INSCRIPTION" },
-  { label: "ÉVALUATION" }
+  { label: "ÉVALUATION" },
 ];
 </script>
 
 <style scoped>
-
 .subtitle-formation {
-  font-family: 'Barlow';
-font-style: normal;
-font-weight: 600;
-font-size: 30px;
-line-height: 35px;
-text-align: center;
-color: #000000;
-margin-left: 34rem;
-margin-right: 34rem;
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 600;
+  font-size: 30px;
+  line-height: 35px;
+  text-align: center;
+  color: #000000;
+  margin-left: 34rem;
+  margin-right: 34rem;
 }
 
 .formation {
-  font-family: 'Barlow';
-font-style: normal;
-font-weight: 600;
-font-size: 90px;
-line-height: 85px;
-text-align: center;
-color: #000000;
-margin-bottom: 1rem;
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 600;
+  font-size: 90px;
+  line-height: 85px;
+  text-align: center;
+  color: #000000;
+  margin-bottom: 1rem;
 }
 .container-title {
   display: flex;
@@ -76,7 +77,6 @@ margin-bottom: 1rem;
   border-bottom: 0.1rem solid #eaeaea;
 }
 
-
 .menu-container {
   display: flex;
   justify-content: space-around;
@@ -99,7 +99,6 @@ margin-bottom: 1rem;
   color: white;
 }
 
-
 .cover-image {
   width: 100%;
   height: 35rem;
@@ -108,5 +107,4 @@ margin-bottom: 1rem;
   margin: 0 auto;
   transform: scaleX(-1);
 }
-
 </style>

+ 26 - 29
components/Formation/Catalogue.vue

@@ -1,6 +1,6 @@
 <template>
   <LayoutContainer>
-      <h4 class="title">Découvrez notre catalogue de formation</h4>
+    <h4 class="title">Découvrez notre catalogue de formation</h4>
 
     <v-row>
       <v-col cols="12">
@@ -229,33 +229,32 @@
 
 <style scoped>
 .centered-row {
-    margin: auto;
-    justify-content: center; /* Utilisez ceci si vous utilisez flexbox */
-  }
-.catalog{
-  font-family: 'Barlow';
-font-style: normal;
-font-weight: 600;
-font-size: 42px;
-line-height: 42px;
-color: #071B1F;
-margin-bottom: 3rem;
-
+  margin: auto;
+  justify-content: center; /* Utilisez ceci si vous utilisez flexbox */
+}
+.catalog {
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 600;
+  font-size: 42px;
+  line-height: 42px;
+  color: #071b1f;
+  margin-bottom: 3rem;
 }
 
-.title{
-margin-bottom: 3rem;
-font-family: 'Barlow';
-font-style: normal;
-font-weight: 600;
-font-size: 10px;
-line-height: 15px;
-display: flex;
-align-items: center;
-letter-spacing: 0.18em;
-text-transform: uppercase;
-width: 13rem;
-color: #071B1F;
+.title {
+  margin-bottom: 3rem;
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 600;
+  font-size: 10px;
+  line-height: 15px;
+  display: flex;
+  align-items: center;
+  letter-spacing: 0.18em;
+  text-transform: uppercase;
+  width: 13rem;
+  color: #071b1f;
 }
 .chip-download {
   width: 70%;
@@ -323,8 +322,6 @@ color: #071B1F;
   width: 70%;
 }
 
-
-
 .details-card {
   font-family: "Barlow";
   font-style: normal;
@@ -366,7 +363,7 @@ color: #071B1F;
   margin-left: 4rem;
 }
 
-.container{
+.container {
   margin-bottom: 3rem;
 }
 </style>

+ 2 - 3
components/Formation/Certification.vue

@@ -39,7 +39,6 @@
 <script setup></script>
 
 <style scoped>
-
 .qualiopi-img {
   margin-bottom: 3rem;
   bottom: 4rem;
@@ -52,7 +51,7 @@
   font-size: 16px;
   line-height: 20px;
   color: #091d20;
-  margin-top: 1rem
+  margin-top: 1rem;
 }
 .details-certifications {
   font-family: "Barlow";
@@ -61,7 +60,7 @@
   font-size: 16px;
   line-height: 20px;
   color: #091d20;
-  margin-top: 1rem
+  margin-top: 1rem;
 }
 
 .title-certification {

+ 33 - 36
components/Formation/FAQ.vue

@@ -4,41 +4,41 @@
       <v-row>
         <v-col cols="6">
           <div class="container-left">
-
             <div class="container-title">
-            <v-icon class="fa-brands fa-react icon-title"></v-icon>
-            <h5 class="subtitle-faq">
-              Vous voulez tirer le meilleur de notre logiciel ?
-            </h5>
-          </div>
-          <h3 class="title-faq">
-            Quelle que soit votre demande, notre équipe est à vos côtés pour
-            vous guider
-          </h3>
-
-          <v-btn class="btn-faq"> Consulter notre FAQ </v-btn>
+              <v-icon class="fa-brands fa-react icon-title"></v-icon>
+              <h5 class="subtitle-faq">
+                Vous voulez tirer le meilleur de notre logiciel ?
+              </h5>
+            </div>
+            <h3 class="title-faq">
+              Quelle que soit votre demande, notre équipe est à vos côtés pour
+              vous guider
+            </h3>
+
+            <v-btn class="btn-faq"> Consulter notre FAQ </v-btn>
           </div>
-
         </v-col>
 
         <v-col cols="6">
-
           <div class="btn-container">
             <v-btn class="btn-faq-tuto">
-            <div class="container-button">
-        <v-icon class="fa-brands fa-react icon-button"></v-icon>
-        <p class="text-btn">De nombreux articles tutoriels accessibles 24h/24</p>
-      </div>
-          </v-btn>
+              <div class="container-button">
+                <v-icon class="fa-brands fa-react icon-button"></v-icon>
+                <p class="text-btn">
+                  De nombreux articles tutoriels accessibles 24h/24
+                </p>
+              </div>
+            </v-btn>
 
-          <v-btn class="btn-faq-tuto">
-            <div class="container-button">
-        <v-icon class="fa-brands fa-react icon-button"></v-icon>
-        <p class="text-btn">De nombreux articles tutoriels accessibles 24h/24</p>
-      </div>
-          </v-btn>
+            <v-btn class="btn-faq-tuto">
+              <div class="container-button">
+                <v-icon class="fa-brands fa-react icon-button"></v-icon>
+                <p class="text-btn">
+                  De nombreux articles tutoriels accessibles 24h/24
+                </p>
+              </div>
+            </v-btn>
           </div>
-
         </v-col>
       </v-row>
     </div>
@@ -48,27 +48,25 @@
 <script setup></script>
 
 <style scoped>
-
-.container-left{
+.container-left {
   margin-left: 6rem;
 }
 
 .text-btn {
-  font-family: 'Barlow';
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 500;
   font-size: 16px;
   line-height: 26px;
-  color: #F0E8E4;
+  color: #f0e8e4;
 }
-.btn-container{
+.btn-container {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: space-between;
   margin-top: 10rem;
   margin-right: 15rem;
-  
 }
 
 .container-button {
@@ -79,13 +77,13 @@
   height: 3.5rem;
 }
 
-.icon-button{
+.icon-button {
   color: #fff;
   font-size: 2rem;
   margin-right: 1rem;
   margin-left: 2rem;
 }
-.btn-faq-tuto{
+.btn-faq-tuto {
   width: 20rem;
   height: 5.5rem;
   margin-left: 3rem;
@@ -102,7 +100,7 @@
   text-transform: none !important;
 }
 
-.subtitle-faq{
+.subtitle-faq {
   font-size: 1.5rem;
   font-weight: 500;
   color: #fff;
@@ -128,7 +126,6 @@
   font-size: 0.8rem;
   text-transform: none !important;
   line-height: 1rem;
-  
 }
 .title-faq {
   font-size: 2rem;

+ 23 - 25
components/Formation/Participation.vue

@@ -19,36 +19,34 @@
     <v-row>
       <v-col cols="12">
         <p class="details-participations">
-        Utilisez le menu "Contact" situé en haut et en bas de la page pour plus
-        d'informations. Nous vous répondons sous 48h (hors week-ends). Délais
-        d'accès: Après accord, nous mettons tout en oeuvre pour vous mettre à
-        disposition un formateur sous 1 mois.
-      </p>
+          Utilisez le menu "Contact" situé en haut et en bas de la page pour
+          plus d'informations. Nous vous répondons sous 48h (hors week-ends).
+          Délais d'accès: Après accord, nous mettons tout en oeuvre pour vous
+          mettre à disposition un formateur sous 1 mois.
+        </p>
 
-      <p class="details-participations">
-        Nos formations peuvent être accessibles aux personnes en situation de
-        handicap. Chaque situation étant unique, nous vous demandons de préciser
-        à l’inscription votre handicap. Nous pourrons ainsi confirmer l’ensemble
-        des possibilités afin de vous permettre de suivre la formation dans les
-        meilleures conditions en accord avec votre employeur. Pour toutes
-        informations complémentaires, nous vous conseillons les structures
-        suivantes : ONISEP, AGEFIPH et FIPHFP. Pour le bon déroulement de la
-        formation, il est nécessaire de disposer d’un espace de travail calme et
-        équipé d’au moins un ordinateur, connecté à internet, et dont le
-        navigateur (Mozilla Firefox, Google Chrome, ou Apple Safari) est à jour.
-        Nous recommandons d’utiliser un ordinateur par personne. Les
-        participants devront également avoir des ordinateurs équipés de micros
-        et de haut-parleurs, préférablement des micro-casques pour un meilleur
-        confort d’écoute.
-      </p>
+        <p class="details-participations">
+          Nos formations peuvent être accessibles aux personnes en situation de
+          handicap. Chaque situation étant unique, nous vous demandons de
+          préciser à l’inscription votre handicap. Nous pourrons ainsi confirmer
+          l’ensemble des possibilités afin de vous permettre de suivre la
+          formation dans les meilleures conditions en accord avec votre
+          employeur. Pour toutes informations complémentaires, nous vous
+          conseillons les structures suivantes : ONISEP, AGEFIPH et FIPHFP. Pour
+          le bon déroulement de la formation, il est nécessaire de disposer d’un
+          espace de travail calme et équipé d’au moins un ordinateur, connecté à
+          internet, et dont le navigateur (Mozilla Firefox, Google Chrome, ou
+          Apple Safari) est à jour. Nous recommandons d’utiliser un ordinateur
+          par personne. Les participants devront également avoir des ordinateurs
+          équipés de micros et de haut-parleurs, préférablement des
+          micro-casques pour un meilleur confort d’écoute.
+        </p>
       </v-col>
-
     </v-row>
   </LayoutContainer>
 </template>
 
 <style scoped>
-
 .details-participations {
   font-family: "Barlow";
   font-style: normal;
@@ -56,12 +54,12 @@
   font-size: 16px;
   line-height: 20px;
   margin-top: 1rem;
-  display: flex ;
+  display: flex;
   margin-left: 23rem;
   margin-right: 23rem;
 }
 
-.participation-img{
+.participation-img {
   margin-top: 2rem;
   width: 40%;
   margin-left: auto;

+ 76 - 133
components/Formation/Solutions.vue

@@ -2,192 +2,135 @@
   <LayoutContainer>
     <v-row>
       <v-col cols="12">
-        <h4 class="solution-title text-center">Ces solutions peuvent vous intéresser</h4>
+        <h4 class="solution-title text-center">
+          Ces solutions peuvent vous intéresser
+        </h4>
       </v-col>
     </v-row>
-  
+
     <v-row class="row-artist">
       <v-col cols="3">
-        <v-img
-        src="/images/opentalent_artist_black.png"
-        class="logo"
-        >
-        </v-img>
+        <v-img src="/images/opentalent_artist_black.png" class="logo"> </v-img>
       </v-col>
-      
+
       <v-col cols="2">
         <h5 class="solution-name">Opentalent Artist</h5>
       </v-col>
-  
+
       <v-col cols="7">
         <!-- list v-chip-->
-        <v-chip-group
-        active-class="primary--text"
-        column
-        >
-          <v-chip
-          class="ma-2 chip"
-          label
-          >
+        <v-chip-group active-class="primary--text" column>
+          <v-chip class="ma-2 chip" label>
             <span>Agenda</span>
           </v-chip>
-          <v-chip
-          class="ma-2"
-          label
-          >
+          <v-chip class="ma-2" label>
             <span>Facturation</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip"
-          label
-          >
+          <v-chip class="ma-2 chip" label>
             <span>Comptabilité</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip"
-          label
-          >
+          <v-chip class="ma-2 chip" label>
             <span>Communication</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip"
-          label
-          >
+          <v-chip class="ma-2 chip" label>
             <span>Site internet</span>
           </v-chip>
-      </v-chip-group>
+        </v-chip-group>
       </v-col>
-  
     </v-row>
-  
+
     <v-row class="row-artist">
       <v-col cols="3">
-        <v-img
-        src="/images/opentalent_manager_black.jpg"
-        class="logo"
-  
-        >
-        </v-img>
+        <v-img src="/images/opentalent_manager_black.jpg" class="logo"> </v-img>
       </v-col>
-      
+
       <v-col cols="2">
         <h5 class="solution-name">Opentalent Manager</h5>
       </v-col>
-  
+
       <v-col cols="7">
         <!-- list v-chip-->
-        <v-chip-group
-        active-class="primary--text"
-        column
-        >
-          <v-chip
-          class="ma-2 chip"
-          color="primary"
-          label
-          >
+        <v-chip-group active-class="primary--text" column>
+          <v-chip class="ma-2 chip" color="primary" label>
             <span>Agenda</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip" color="primary" label>
             <span>Facturation</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip" color="primary" label>
             <span>Comptabilité</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip" color="primary" label>
             <span>Communication</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip" color="primary" label>
             <span>Site internet</span>
           </v-chip>
-      </v-chip-group>
+        </v-chip-group>
       </v-col>
-  
     </v-row>
   </LayoutContainer>
-  
-  </template>
-  
-  <script setup>
-  </script>
-  
-  <style scoped>
-  
-  .chip {
-    /* position: inherit; */
-    color: black;
-    border: 1px solid #0E2D32;
-    border-radius: 3rem; 
-    text-transform: uppercase;
-  
-  font-family: 'Barlow';
+</template>
+
+<script setup></script>
+
+<style scoped>
+.chip {
+  /* position: inherit; */
+  color: black;
+  border: 1px solid #0e2d32;
+  border-radius: 3rem;
+  text-transform: uppercase;
+
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 500;
   font-size: 14px;
   line-height: 16px;
-  
+
   /* identical to box height, or 114% */
   display: flex;
   align-items: center;
   text-align: center;
   letter-spacing: 0.2em;
-  }
-  
-  .row-artist{
-    border-top: 1px solid #D1CDC7;
-    margin-left: 2rem;
-    margin-right: 2rem;
-  }
-  
-  
-  .solution-name{
-    font-family: 'Barlow';
+}
+
+.row-artist {
+  border-top: 1px solid #d1cdc7;
+  margin-left: 2rem;
+  margin-right: 2rem;
+}
+
+.solution-name {
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 300;
   font-size: 1.5rem;
   line-height: 1.5rem;
-  color: #0E2D32;
-  
-  
-  }
-  
-  .row-artist{
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-  }
-  .solution-title{
-    font-family: "Barlow";
-    font-style: normal;
-    font-weight: 500;
-    font-size: 1.5rem;
-    line-height: 1.5rem;
-    color: #000000;
-    margin-top: 2rem;
-    margin-bottom: 2rem;
-    text-align: center;
-  
-  }
-  
-  .logo{
-    width: 10rem;
-    height: 10rem;
-    margin-left: 2rem;
-    margin-right: 2rem;
-  }
-  </style>
+  color: #0e2d32;
+}
+
+.row-artist {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+.solution-title {
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 500;
+  font-size: 1.5rem;
+  line-height: 1.5rem;
+  color: #000000;
+  margin-top: 2rem;
+  margin-bottom: 2rem;
+  text-align: center;
+}
+
+.logo {
+  width: 10rem;
+  height: 10rem;
+  margin-left: 2rem;
+  margin-right: 2rem;
+}
+</style>

+ 3 - 3
components/Home/Caroussel.vue

@@ -85,7 +85,7 @@ const carouselItems = ref([
     buttonClass: "btn-school",
     image: "/images/carousel/school/Fille_School.png",
     color: "rgba(32, 147, 190, 0.4)",
-    link: "/logiciels/school"
+    link: "/logiciels/school",
   },
   {
     logo: "/images/carousel/artist/artist.png",
@@ -94,7 +94,7 @@ const carouselItems = ref([
     buttonClass: "btn-artist",
     image: "/images/carousel/artist/musician.png",
     color: "rgba(250, 194, 10, 0.4)",
-    link: "/logiciels/artist"
+    link: "/logiciels/artist",
   },
   {
     logo: "/images/carousel/manager/manager.png",
@@ -103,7 +103,7 @@ const carouselItems = ref([
     buttonClass: "btn-manager",
     image: "/images/carousel/manager/fédération.png",
     color: "rgba(216, 5, 11, 0.4)",
-    link: "/logiciels/manager"
+    link: "/logiciels/manager",
   },
 ]);
 </script>

+ 4 - 4
components/Home/Help.vue

@@ -12,9 +12,9 @@
           </h4>
 
           <p class="need-help">
-            Besoin d’aide ? <br> Vous souhaitez en savoir plus sur nos solutions ou
-            vous avez besoin d'assistance sur l'utilisation de l'un de nos
-            logiciels ?
+            Besoin d’aide ? <br />
+            Vous souhaitez en savoir plus sur nos solutions ou vous avez besoin
+            d'assistance sur l'utilisation de l'un de nos logiciels ?
           </p>
 
           <v-row>
@@ -105,6 +105,6 @@
 
 .container {
   margin-bottom: 1rem;
-  margin-top: 3rem;;
+  margin-top: 3rem;
 }
 </style>

+ 9 - 6
components/Home/Promotion.vue

@@ -27,8 +27,13 @@
     </v-col>
     <v-row>
       <v-col cols="12">
-        <v-img src="/images/home/écran.JPG" class="screen" :class="{ zoom: isZoomed }" @mouseover="zoomIn" @mouseleave="zoomOut"></v-img>
-
+        <v-img
+          src="/images/home/écran.JPG"
+          class="screen"
+          :class="{ zoom: isZoomed }"
+          @mouseover="zoomIn"
+          @mouseleave="zoomOut"
+        ></v-img>
       </v-col>
     </v-row>
 
@@ -71,7 +76,6 @@
 </template>
 
 <script setup>
-
 const isZoomed = ref(false);
 
 const zoomIn = () => {
@@ -86,7 +90,7 @@ const zoomOut = () => {
 <style scoped>
 .screen {
   width: 900px;
-  object-fit: cover;  
+  object-fit: cover;
   margin: 2rem auto;
   text-align: center;
   border-radius: 20px;
@@ -95,7 +99,7 @@ const zoomOut = () => {
 }
 
 .screen:hover {
-  transform: scale(1.1); 
+  transform: scale(1.1);
 }
 
 .subtitle {
@@ -183,5 +187,4 @@ const zoomOut = () => {
   height: 5rem;
   border-radius: 5rem;
 }
-
 </style>

+ 0 - 1
components/Home/Reviews.vue

@@ -178,7 +178,6 @@ const items = ref([
   { src: "/images/reviews/review4.png" },
   { src: "/images/reviews/review5.png" },
 ]);
-
 </script>
 
 <style scoped>

+ 33 - 34
components/Home/Solution.vue

@@ -1,9 +1,9 @@
 <template>
   <LayoutContainer :overflow="false">
     <div class="d-flex justify-center align-center flex-column">
-        <v-icon size="8" class="fa-solid fa-circle icon-title"></v-icon>
-    <p class="text-center solution-subtitle">3 solutions</p>
-  </div>
+      <v-icon size="8" class="fa-solid fa-circle icon-title"></v-icon>
+      <p class="text-center solution-subtitle">3 solutions</p>
+    </div>
     <h3 class="text-center title">
       Trouvez la solution <br />
       faite pour vous
@@ -20,17 +20,16 @@
 
         <nuxt-link to="/logiciels/artist">
           <v-row>
-          <div class="artist-image">
-            <v-img
-              src="/images/OpenTalent_LogoNoir_Jaune_white.png"
-              class="logo"
-            >
-            </v-img>
-          </div>
-        </v-row>
+            <div class="artist-image">
+              <v-img
+                src="/images/OpenTalent_LogoNoir_Jaune_white.png"
+                class="logo"
+              >
+              </v-img>
+            </div>
+          </v-row>
         </nuxt-link>
 
-
         <v-row>
           <v-col cols="6">
             <ul class="list-solutions">
@@ -43,7 +42,7 @@
 
           <v-col cols="6">
             <ul class="list-solutions">
-              <li class="details-solution">Communication </li>
+              <li class="details-solution">Communication</li>
               <li class="details-solution">Statistiques</li>
               <li class="details-solution">Site internet</li>
               <li class="details-solution">Partage de données en réseau</li>
@@ -62,19 +61,19 @@
 
         <v-row>
           <nuxt-link to="/logiciels/manager">
-          <v-row>
-            <div class="manager-image">
-              <v-img
-                src="/images/OpenTalent_LogoNoir_rouge_manager_white.png"
-                class="logo"
-              >
-              </v-img>
-              <div class="overlay">
-                <button class="discover-button">Découvrir</button>
+            <v-row>
+              <div class="manager-image">
+                <v-img
+                  src="/images/OpenTalent_LogoNoir_rouge_manager_white.png"
+                  class="logo"
+                >
+                </v-img>
+                <div class="overlay">
+                  <button class="discover-button">Découvrir</button>
+                </div>
               </div>
-            </div>
-          </v-row>
-        </nuxt-link>
+            </v-row>
+          </nuxt-link>
         </v-row>
 
         <v-row>
@@ -108,12 +107,13 @@
 
         <v-row>
           <nuxt-link to="/logiciels/school">
-          <v-row>
-            <div class="school-image">
-              <v-img src="/images/logo_school_white.png" class="logo"> </v-img>
-            </div>
-          </v-row>
-        </nuxt-link>
+            <v-row>
+              <div class="school-image">
+                <v-img src="/images/logo_school_white.png" class="logo">
+                </v-img>
+              </div>
+            </v-row>
+          </nuxt-link>
         </v-row>
 
         <v-row>
@@ -331,15 +331,14 @@
   font-style: normal;
   font-size: 15px;
   line-height: 1rem;
-  margin-top: .5rem;
+  margin-top: 0.5rem;
   margin-bottom: 1rem;
   color: #c1eff0;
 }
 .container {
   background: #0e2d32;
-  margin-bottom: 20rem;;
+  margin-bottom: 20rem;
   height: 30rem;
   position: relative;
 }
-
 </style>

+ 0 - 3
components/JoinUs/Banner.vue

@@ -19,15 +19,12 @@
       ipsa laborum sed internos dolor in pariatur vitae. Et quis nostrum non
       praesentium impedit 33 doloribus cumque et adipisci velit!
     </h3>
-
-
   </LayoutContainer>
 </template>
 
 <script setup></script>
 
 <style scoped>
-
 .join-title {
   font-family: "Barlow";
   font-style: normal;

+ 11 - 14
components/JoinUs/Missions.vue

@@ -42,9 +42,7 @@
         minima minus eveniet, ipsam voluptatum beatae asperiores aut accusamus
         autem magnam.
       </p>
-      <v-btn class="btn-apply">
-        Envoyer ma candidature
-      </v-btn>
+      <v-btn class="btn-apply"> Envoyer ma candidature </v-btn>
     </v-row>
   </LayoutContainer>
 </template>
@@ -85,15 +83,14 @@ const jobs = ref([
 </script>
 
 <style scoped>
-
-.apply-row{
+.apply-row {
   margin-top: 5rem;
   margin-bottom: 5rem;
   margin-left: 4rem;
   margin-right: 4rem;
 }
 
-.apply{
+.apply {
   font-family: "Barlow";
   font-style: normal;
   font-weight: 600;
@@ -104,14 +101,14 @@ const jobs = ref([
   margin-bottom: 1rem;
 }
 
-.apply-now{
-  font-family: 'Barlow';
-font-style: italic;
-font-weight: 300;
-font-size: 34px;
-line-height: 40px;
-color: #091D20;
-margin-bottom: 2rem;
+.apply-now {
+  font-family: "Barlow";
+  font-style: italic;
+  font-weight: 300;
+  font-size: 34px;
+  line-height: 40px;
+  color: #091d20;
+  margin-bottom: 2rem;
 }
 .description-job {
   font-family: "Barlow";

+ 3 - 3
components/Layout/Container.vue

@@ -9,13 +9,13 @@
 </template>
 
 <script setup>
-import { ref } from 'vue';
+import { ref } from "vue";
 
 const props = defineProps({
   overflow: {
     type: Boolean,
-    default: true
-  }
+    default: true,
+  },
 });
 
 const overflow = ref(props.overflow);

+ 2 - 11
components/Layout/FAQ.vue

@@ -53,7 +53,6 @@
 <style scoped>
 .container-left {
   margin-left: 6rem;
-  
 }
 
 .text-btn {
@@ -65,7 +64,6 @@
   color: #f0e8e4;
   white-space: normal !important;
   text-align: left;
-  
 }
 .btn-container {
   display: flex;
@@ -90,7 +88,6 @@
   margin-right: 0.7rem;
   margin-left: 2rem;
   z-index: 2;
-
 }
 .btn-faq-tuto {
   z-index: 2;
@@ -125,7 +122,6 @@
   letter-spacing: 0.18em;
   text-transform: uppercase;
   z-index: 2;
-
 }
 .btn-faq {
   width: 14rem;
@@ -151,14 +147,12 @@
   margin-right: 15rem;
   width: 28rem;
   margin-bottom: 3rem;
-
 }
 .container-title {
   display: flex;
   align-items: center;
   margin-bottom: 1rem;
   margin-left: 3rem;
-  
 }
 
 .icon-title {
@@ -166,8 +160,6 @@
   color: #64afb7;
   margin-right: 0.5rem;
   margin-top: 3rem;
-
-
 }
 .subtitle-faq {
   color: #fff;
@@ -175,7 +167,6 @@
   font-family: "Barlow";
   width: 15rem;
   margin-right: 15rem;
-
 }
 .container-img {
   background-image: url("/images/logiciels/school/faq.jpg");
@@ -191,13 +182,13 @@
 }
 
 .container-img::after {
-  content: '';
+  content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
-  background: rgba(0, 0, 0, 0.6); 
+  background: rgba(0, 0, 0, 0.6);
   z-index: 1;
 }
 

+ 18 - 19
components/Layout/Footer.vue

@@ -49,7 +49,7 @@
           <v-col cols="2">
             <v-row class="title-link">Liens Rapides</v-row>
             <v-row>
-                <small class="small-link">A propos</small>
+              <small class="small-link">A propos</small>
             </v-row>
             <v-row>
               <small class="small-link">A propos</small>
@@ -90,15 +90,15 @@
 
             <v-row>
               <v-col cols="2">
-                <v-icon left class=" fab fa-facebook"></v-icon>
+                <v-icon left class="fab fa-facebook"></v-icon>
               </v-col>
 
               <v-col cols="2">
-                <v-icon left class=" fab fa-linkedin"></v-icon>
+                <v-icon left class="fab fa-linkedin"></v-icon>
               </v-col>
 
               <v-col cols="2">
-                <v-icon left class=" fab fa-youtube"></v-icon>
+                <v-icon left class="fab fa-youtube"></v-icon>
               </v-col>
             </v-row>
           </v-col>
@@ -113,31 +113,30 @@ import "@fortawesome/fontawesome-free/css/all.css";
 </script>
 
 <style scoped>
-
 /** icon 2ieme and 3eme child */
-.icon:nth-child(2){
+.icon:nth-child(2) {
   margin-left: 10px;
 }
 .title-link {
-  font-family: 'Barlow';
-font-style: normal;
-font-weight: 500;
-font-size: 1rem;
-line-height: 20px;
-margin-bottom: 1rem;
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 500;
+  font-size: 1rem;
+  line-height: 20px;
+  margin-bottom: 1rem;
 }
 /** small link : margin bottom + color gris + small */
 .small-link {
   margin-bottom: 0.5rem;
-  font-family: 'Barlow';
-font-style: normal;
-font-weight: 300;
-font-size: 0.7rem;
-line-height: 20px;
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 300;
+  font-size: 0.7rem;
+  line-height: 20px;
 
-/* identical to box height, or 143% */
+  /* identical to box height, or 143% */
 
-color: #FFFFFF;
+  color: #ffffff;
 }
 .container {
   background: #091d20;

+ 18 - 15
components/Layout/Navigation.vue

@@ -2,20 +2,24 @@
   <LayoutContainer>
     <v-row class="menu-bar custom-row">
       <v-col cols="6" sm="4" md="2">
-  <nuxt-link to="/">
-    <v-img
-      class="logo"
-      src="/images/Opentalent.png"
-    ></v-img>
-  </nuxt-link>
-</v-col>
-
+        <nuxt-link to="/">
+          <v-img class="logo" src="/images/Opentalent.png"></v-img>
+        </nuxt-link>
+      </v-col>
 
       <v-col cols="12" sm="7" md="5">
-        <nuxt-link class="common-styles menu-link" to="/about">A propos</nuxt-link>
-        <nuxt-link class="common-styles menu-link" to="/software">Nos logiciels</nuxt-link>
-        <nuxt-link class="common-styles menu-link" to="/directory">Annuaire</nuxt-link>
-        <nuxt-link class="common-styles menu-link" to="/news">Actualités</nuxt-link>
+        <nuxt-link class="common-styles menu-link" to="/about"
+          >A propos</nuxt-link
+        >
+        <nuxt-link class="common-styles menu-link" to="/software"
+          >Nos logiciels</nuxt-link
+        >
+        <nuxt-link class="common-styles menu-link" to="/directory"
+          >Annuaire</nuxt-link
+        >
+        <nuxt-link class="common-styles menu-link" to="/news"
+          >Actualités</nuxt-link
+        >
       </v-col>
 
       <v-col cols="12" sm="12" md="5" class="buttons-col">
@@ -36,7 +40,6 @@
   </LayoutContainer>
 </template>
 
-
 <script></script>
 
 <style scoped>
@@ -52,7 +55,7 @@
   font-family: "Barlow";
   font-style: normal;
   font-weight: 700;
-  font-size: .7rem;
+  font-size: 0.7rem;
   line-height: 15px;
 }
 
@@ -81,7 +84,7 @@
   text-decoration: none;
   padding: 1.1rem;
   font-weight: 500;
-  font-size: .96rem;
+  font-size: 0.96rem;
   letter-spacing: 0.1em;
   text-transform: uppercase;
   color: #0e2d32;

+ 1 - 1
components/Logiciels/Artist/Avantages.vue

@@ -120,7 +120,7 @@
 }
 
 .icon-title {
-  color: #FAC20A;
+  color: #fac20a;
   font-size: 1.5rem;
   margin-left: 2rem;
 }

+ 7 - 14
components/Logiciels/Artist/Banner.vue

@@ -6,7 +6,7 @@
           <h1>Manager</h1>
         </v-col>
         <v-col cols="4" class="logiciel">
-          <h1>Opentalent Artist </h1>
+          <h1>Opentalent Artist</h1>
         </v-col>
         <v-col cols="4" class="text-right">
           <h1>School</h1>
@@ -44,13 +44,10 @@
         </div>
       </v-col>
     </v-row>
-
   </LayoutContainer>
 </template>
 
-<script setup>
-
-</script>
+<script setup></script>
 
 <style scoped>
 .container-title {
@@ -102,17 +99,15 @@
   margin-right: 5rem;
 }
 
-
 .black-square {
   position: absolute;
   bottom: 0rem;
   right: 0;
   width: 13rem;
   height: 10rem;
-  background: #FAC20A;
+  background: #fac20a;
 }
 
-
 .white-square {
   position: absolute;
   bottom: 0rem;
@@ -163,20 +158,18 @@
   position: relative;
   overflow: hidden;
   display: flex;
-  justify-content: center; 
+  justify-content: center;
   align-items: flex-start;
-  height: 25rem; 
+  height: 25rem;
 }
 
-
 .cover-image {
   width: 100%;
-  height: auto; 
+  height: auto;
   object-fit: cover;
   transition: transform 0.2s;
   margin: 0 auto;
   transform: scaleX(-1);
-  display: block; 
+  display: block;
 }
-
 </style>

+ 33 - 36
components/Logiciels/Artist/FAQ.vue

@@ -4,41 +4,41 @@
       <v-row>
         <v-col cols="6">
           <div class="container-left">
-
             <div class="container-title">
-            <v-icon class="fa-brands fa-react icon-title"></v-icon>
-            <h5 class="subtitle-faq">
-              Vous voulez tirer le meilleur de notre logiciel ?
-            </h5>
-          </div>
-          <h3 class="title-faq">
-            Quelle que soit votre demande, notre équipe est à vos côtés pour
-            vous guider
-          </h3>
-
-          <v-btn class="btn-faq"> Consulter notre FAQ </v-btn>
+              <v-icon class="fa-brands fa-react icon-title"></v-icon>
+              <h5 class="subtitle-faq">
+                Vous voulez tirer le meilleur de notre logiciel ?
+              </h5>
+            </div>
+            <h3 class="title-faq">
+              Quelle que soit votre demande, notre équipe est à vos côtés pour
+              vous guider
+            </h3>
+
+            <v-btn class="btn-faq"> Consulter notre FAQ </v-btn>
           </div>
-
         </v-col>
 
         <v-col cols="6">
-
           <div class="btn-container">
             <v-btn class="btn-faq-tuto">
-            <div class="container-button">
-        <v-icon class="fa-brands fa-react icon-button"></v-icon>
-        <p class="text-btn">De nombreux articles tutoriels accessibles 24h/24</p>
-      </div>
-          </v-btn>
+              <div class="container-button">
+                <v-icon class="fa-brands fa-react icon-button"></v-icon>
+                <p class="text-btn">
+                  De nombreux articles tutoriels accessibles 24h/24
+                </p>
+              </div>
+            </v-btn>
 
-          <v-btn class="btn-faq-tuto">
-            <div class="container-button">
-        <v-icon class="fa-brands fa-react icon-button"></v-icon>
-        <p class="text-btn">De nombreux articles tutoriels accessibles 24h/24</p>
-      </div>
-          </v-btn>
+            <v-btn class="btn-faq-tuto">
+              <div class="container-button">
+                <v-icon class="fa-brands fa-react icon-button"></v-icon>
+                <p class="text-btn">
+                  De nombreux articles tutoriels accessibles 24h/24
+                </p>
+              </div>
+            </v-btn>
           </div>
-
         </v-col>
       </v-row>
     </div>
@@ -48,27 +48,25 @@
 <script setup></script>
 
 <style scoped>
-
-.container-left{
+.container-left {
   margin-left: 6rem;
 }
 
 .text-btn {
-  font-family: 'Barlow';
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 500;
   font-size: 16px;
   line-height: 26px;
-  color: #F0E8E4;
+  color: #f0e8e4;
 }
-.btn-container{
+.btn-container {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: space-between;
   margin-top: 10rem;
   margin-right: 15rem;
-  
 }
 
 .container-button {
@@ -79,13 +77,13 @@
   height: 3.5rem;
 }
 
-.icon-button{
+.icon-button {
   color: #fff;
   font-size: 2rem;
   margin-right: 1rem;
   margin-left: 2rem;
 }
-.btn-faq-tuto{
+.btn-faq-tuto {
   width: 20rem;
   height: 5.5rem;
   margin-left: 3rem;
@@ -102,7 +100,7 @@
   text-transform: none !important;
 }
 
-.subtitle-faq{
+.subtitle-faq {
   font-size: 1.5rem;
   font-weight: 500;
   color: #fff;
@@ -128,7 +126,6 @@
   font-size: 0.8rem;
   text-transform: none !important;
   line-height: 1rem;
-  
 }
 .title-faq {
   font-size: 2rem;

+ 2 - 2
components/Logiciels/Artist/Fonctionnalites.vue

@@ -218,13 +218,13 @@
 .icon-details {
   font-size: 1.5rem;
   margin-bottom: 0.9rem;
-  color:#FAC20A;
+  color: #fac20a;
 }
 
 .icon-title {
   font-size: 0.8rem;
   margin-bottom: 2rem;
-  color:#FAC20A;
+  color: #fac20a;
 }
 
 .subtitle-fontionnalite {

+ 21 - 23
components/Logiciels/Artist/MenuScroll.vue

@@ -1,32 +1,32 @@
 <template>
   <div id="Presentation">
-  <LayoutContainer>
-    <v-row>
-      <v-col cols="12" class="menu-container">
-        <div v-for="menu in menus" :key="menu.label" @click="navigate(menu)">
-          <v-chip v-if="activeMenu === menu.label" class="active-menu">{{
-            menu.label
-          }}</v-chip>
-          <span v-else>{{ menu.label }}</span>
-        </div>
-      </v-col>
-    </v-row>
-  </LayoutContainer>
-</div>
+    <LayoutContainer>
+      <v-row>
+        <v-col cols="12" class="menu-container">
+          <div v-for="menu in menus" :key="menu.label" @click="navigate(menu)">
+            <v-chip v-if="activeMenu === menu.label" class="active-menu">{{
+              menu.label
+            }}</v-chip>
+            <span v-else>{{ menu.label }}</span>
+          </div>
+        </v-col>
+      </v-row>
+    </LayoutContainer>
+  </div>
 </template>
 
 <script setup>
 import { ref } from "vue";
 
 const menus = [
-  { label: 'Presentation' },
-  { label: 'Avantages' },
-  { label: 'Fonctionnalites' },
-  { label: 'Comparatif' },
-  { label: 'Contact' },
-  { label: 'Accompagnement' },
-  { label: 'Temoignages' },
-  { label: 'Aide' }
+  { label: "Presentation" },
+  { label: "Avantages" },
+  { label: "Fonctionnalites" },
+  { label: "Comparatif" },
+  { label: "Contact" },
+  { label: "Accompagnement" },
+  { label: "Temoignages" },
+  { label: "Aide" },
 ];
 
 const activeMenu = ref(menus[0].label);
@@ -67,6 +67,4 @@ const navigate = (menu) => {
   cursor: pointer;
   text-decoration: underline;
 }
-
-
 </style>

+ 111 - 113
components/Logiciels/Artist/Outil.vue

@@ -1,132 +1,131 @@
 <template>
-    <div id="Presentation">
-  <LayoutContainer>
-    <v-row class="outil-row">
-      <v-col cols="4">
-        <div class="title">
-          <v-icon size="10" class="fa-solid fa-circle icon-title"></v-icon>
-          <h4>Présentation d'opentalent artist</h4>
-        </div>
-        <v-img src="/images/logiciels/school/screen.jpg" class="screen-img">
-        </v-img>
+  <div id="Presentation">
+    <LayoutContainer>
+      <v-row class="outil-row">
+        <v-col cols="4">
+          <div class="title">
+            <v-icon size="10" class="fa-solid fa-circle icon-title"></v-icon>
+            <h4>Présentation d'opentalent artist</h4>
+          </div>
+          <v-img src="/images/logiciels/school/screen.jpg" class="screen-img">
+          </v-img>
 
-        <div class="rectangle-4">
-          <div class="black-circle">
-            <div class="content-flex">
-              <v-img
-                src="/images/OpenTalent_LogoNoir_Jaune_white.png"
-                class="logo-artist"
-              >
-              </v-img>
-              <p class="devis">Sur devis</p>
+          <div class="rectangle-4">
+            <div class="black-circle">
+              <div class="content-flex">
+                <v-img
+                  src="/images/OpenTalent_LogoNoir_Jaune_white.png"
+                  class="logo-artist"
+                >
+                </v-img>
+                <p class="devis">Sur devis</p>
+              </div>
             </div>
           </div>
-        </div>
-      </v-col>
+        </v-col>
 
-      <v-col cols="5">
-        <h2 class="outil-title">Un outil complet en ligne</h2>
-        <ul class="outil-ul">
-          <li class="outil-list">
-            Logiciel de gestion et communication en ligne
-          </li>
-          <li class="outil-list">
-            Destiné aux établissements d'enseignement artistique
-          </li>
-          <li class="outil-list">
-            Gestion quotidienne et en temps réel (suivi pédagogique,
-            facturation, encaissement…)
-          </li>
-          <li class="outil-list">Pilotage complet de votre structure</li>
-        </ul>
-      </v-col>
+        <v-col cols="5">
+          <h2 class="outil-title">Un outil complet en ligne</h2>
+          <ul class="outil-ul">
+            <li class="outil-list">
+              Logiciel de gestion et communication en ligne
+            </li>
+            <li class="outil-list">
+              Destiné aux établissements d'enseignement artistique
+            </li>
+            <li class="outil-list">
+              Gestion quotidienne et en temps réel (suivi pédagogique,
+              facturation, encaissement…)
+            </li>
+            <li class="outil-list">Pilotage complet de votre structure</li>
+          </ul>
+        </v-col>
 
-      <v-col cols="3">
-        <div class="container-square">
-          <v-row>
-            <div class="yellow-square">
-              <v-icon class="fa-regular fa-comments icon"></v-icon>
-              <p class="text-square">Nous contacter</p>
-            </div>
-          </v-row>
+        <v-col cols="3">
+          <div class="container-square">
+            <v-row>
+              <div class="yellow-square">
+                <v-icon class="fa-regular fa-comments icon"></v-icon>
+                <p class="text-square">Nous contacter</p>
+              </div>
+            </v-row>
 
-          <v-row>
-            <div class="yellow-square">
-              <v-icon class="fa-regular fa-circle-info icon"></v-icon>
-              <p class="text-square">Demander une demo</p>
-            </div>
-          </v-row>
-        </div>
-      </v-col>
-      <v-row>
-        <v-col cols="4"> </v-col>
+            <v-row>
+              <div class="yellow-square">
+                <v-icon class="fa-regular fa-circle-info icon"></v-icon>
+                <p class="text-square">Demander une demo</p>
+              </div>
+            </v-row>
+          </div>
+        </v-col>
+        <v-row>
+          <v-col cols="4"> </v-col>
 
-        <v-col cols="5">
-          <h2>Des caractéristiques uniques & dédiées</h2>
-          <div class="picto-container">
-            <div class="picto-group">
-              <v-img
-                class="picto-img"
-                src="/images/logiciels/artist/picto1.png"
-              ></v-img>
-              <p class="picto-text">
-                Logiciel de gestion & communication full web
-              </p>
-            </div>
+          <v-col cols="5">
+            <h2>Des caractéristiques uniques & dédiées</h2>
+            <div class="picto-container">
+              <div class="picto-group">
+                <v-img
+                  class="picto-img"
+                  src="/images/logiciels/artist/picto1.png"
+                ></v-img>
+                <p class="picto-text">
+                  Logiciel de gestion & communication full web
+                </p>
+              </div>
 
-            <div class="picto-group">
-              <v-img
-                class="picto-img"
-                src="/images/logiciels/artist/picto2.png"
-              ></v-img>
-              <p class="picto-text">
-                Boostez votre visibilité & votre communication
-              </p>
-            </div>
+              <div class="picto-group">
+                <v-img
+                  class="picto-img"
+                  src="/images/logiciels/artist/picto2.png"
+                ></v-img>
+                <p class="picto-text">
+                  Boostez votre visibilité & votre communication
+                </p>
+              </div>
 
-            <div class="picto-group">
-              <v-img
-                class="picto-img"
-                src="/images/logiciels/artist/picto3.png"
-              ></v-img>
-              <p class="picto-text">
-                Boostez votre visibilité & votre communication
-              </p>
-            </div>
+              <div class="picto-group">
+                <v-img
+                  class="picto-img"
+                  src="/images/logiciels/artist/picto3.png"
+                ></v-img>
+                <p class="picto-text">
+                  Boostez votre visibilité & votre communication
+                </p>
+              </div>
 
-            <div class="picto-group">
-              <v-img
-                class="picto-img"
-                src="/images/logiciels/artist/picto4.png"
-              ></v-img>
-              <p class="picto-text">Communiquez en réseau</p>
+              <div class="picto-group">
+                <v-img
+                  class="picto-img"
+                  src="/images/logiciels/artist/picto4.png"
+                ></v-img>
+                <p class="picto-text">Communiquez en réseau</p>
+              </div>
             </div>
+          </v-col>
 
-          </div>
-        </v-col>
-
-        <v-col cols="2"> </v-col>
+          <v-col cols="2"> </v-col>
+        </v-row>
       </v-row>
-    </v-row>
 
-    <v-row class="container-green">
-      <v-row>
+      <v-row class="container-green">
+        <v-row>
+          <v-col cols="6">
+            <p class="citation-school">
+              “ Pour les petits comme pour les grands établissements
+              d’enseignement artistique.“
+            </p>
+          </v-col>
+        </v-row>
+
         <v-col cols="6">
-          <p class="citation-school">
-            “ Pour les petits comme pour les grands établissements
-            d’enseignement artistique.“
-          </p>
+          <h6 class="subtitle-logiciel">Logiciel Opentalent</h6>
+          <v-img src="/images/logiciels/school/screen2.png" class="screen2-img">
+          </v-img>
         </v-col>
       </v-row>
-
-      <v-col cols="6">
-        <h6 class="subtitle-logiciel">Logiciel Opentalent</h6>
-        <v-img src="/images/logiciels/school/screen2.png" class="screen2-img">
-        </v-img>
-      </v-col>
-    </v-row>
-  </LayoutContainer>
-</div>
+    </LayoutContainer>
+  </div>
 </template>
 
 <script setup></script>
@@ -142,7 +141,7 @@
 
 .icon-title {
   margin-right: 1.5rem;
-  color: #FAC20A
+  color: #fac20a;
 }
 .text-square {
   font-family: "Barlow";
@@ -238,7 +237,6 @@
   margin-left: -15rem;
 }
 
-
 .rectangle-4 {
   width: 18rem;
   height: 6rem;

+ 2 - 2
components/Logiciels/Artist/Premium.vue

@@ -206,7 +206,7 @@ const tableData = [
   color: #454545;
 }
 .icon-title {
-  color:#FAC20A;
+  color: #fac20a;
   font-size: 1.5rem;
   margin-left: 3rem;
 }
@@ -252,6 +252,6 @@ const tableData = [
 }
 
 .table-body .table-row:nth-child(even) {
-  background-color:#FAC20A33
+  background-color: #fac20a33;
 }
 </style>

+ 12 - 13
components/Logiciels/Artist/Projet.vue

@@ -10,22 +10,21 @@
         </v-col>
 
         <v-col cols="0">
-            <h5 class="subtitle">
-              Opentalent Artist, la solution que vous attendiez...
-            </h5>
-            <p>
-              Que vous soyez une petite ou une structure plus conséquente, notre
-              offre s'adapte à toutes les tailles : le prix de l’abonnement au
-              logiciel varie en fonction du nombre d'élèves, tout en conservant
-              l'intégralité des fonctionnalités.
-            </p>
-            <h3>
-              Adhérents CMF ? Et si on vous disait que vous l’aviez déjà ...
-            </h3>
+          <h5 class="subtitle">
+            Opentalent Artist, la solution que vous attendiez...
+          </h5>
+          <p>
+            Que vous soyez une petite ou une structure plus conséquente, notre
+            offre s'adapte à toutes les tailles : le prix de l’abonnement au
+            logiciel varie en fonction du nombre d'élèves, tout en conservant
+            l'intégralité des fonctionnalités.
+          </p>
+          <h3>
+            Adhérents CMF ? Et si on vous disait que vous l’aviez déjà ...
+          </h3>
         </v-col>
       </v-row>
 
-
       <v-row class="border-row">
         <v-col cols="2">
           <v-img

+ 35 - 37
components/Logiciels/Artist/Reviews.vue

@@ -6,44 +6,43 @@
           <v-col cols="4">
             <h3 class="reviews-title">C'est eux qui en parlent le mieux</h3>
             <div class="d-flex justify-center align-center">
-          <div class="carousel-button" @click="goPrevious">
-            <i class="fas fa-chevron-left"></i>
-          </div>
-          <div class="carousel-button" @click="goNext">
-            <i class="fas fa-chevron-right"></i>
-          </div>
-        </div>
+              <div class="carousel-button" @click="goPrevious">
+                <i class="fas fa-chevron-left"></i>
+              </div>
+              <div class="carousel-button" @click="goNext">
+                <i class="fas fa-chevron-right"></i>
+              </div>
+            </div>
           </v-col>
 
           <v-col cols="8">
             <Carousel
-          :itemsToShow="3"
-          :itemsToScroll="1"
-          v-slot="{ carousel: _carousel }"
-          ref="carousel"
-        >
-          <Slide class="card" v-for="(card, index) in cards" :key="index">
-
-            <div class="card-container">
-              <v-card >
-                <v-card-item>
-                  <v-card-text class="review-description">
-                    {{ card.description }}
-                  </v-card-text>
-
-                  <div class="card-footer">
-                    <v-card-actions class="reviewer-name">
-                      {{ card.name }}
-                    </v-card-actions>
-
-                    <p class="reviewer-status">{{ card.status }}</p>
-                    <p class="reviewer-structure">{{ card.structure }}</p>
-                  </div>
-                </v-card-item>
-              </v-card>
-            </div>
-          </Slide>
-        </Carousel>
+              :itemsToShow="3"
+              :itemsToScroll="1"
+              v-slot="{ carousel: _carousel }"
+              ref="carousel"
+            >
+              <Slide class="card" v-for="(card, index) in cards" :key="index">
+                <div class="card-container">
+                  <v-card>
+                    <v-card-item>
+                      <v-card-text class="review-description">
+                        {{ card.description }}
+                      </v-card-text>
+
+                      <div class="card-footer">
+                        <v-card-actions class="reviewer-name">
+                          {{ card.name }}
+                        </v-card-actions>
+
+                        <p class="reviewer-status">{{ card.status }}</p>
+                        <p class="reviewer-structure">{{ card.structure }}</p>
+                      </div>
+                    </v-card-item>
+                  </v-card>
+                </div>
+              </Slide>
+            </Carousel>
           </v-col>
         </v-row>
       </div>
@@ -65,7 +64,6 @@ const goNext = () => {
   carousel.value.next();
 };
 
-
 const cards = [
   {
     description:
@@ -156,7 +154,7 @@ const cards = [
   color: #071b1f;
 }
 
-.review-description{
+.review-description {
   text-align: left;
 }
 .card-footer {
@@ -194,7 +192,7 @@ const cards = [
 
 .card {
   width: 80rem;
-  margin-left: .5rem;
+  margin-left: 0.5rem;
   border-radius: 1rem;
 }
 

+ 78 - 135
components/Logiciels/Artist/Solutions.vue

@@ -2,193 +2,136 @@
   <LayoutContainer>
     <v-row>
       <v-col cols="12">
-        <h4 class="solution-title text-center">Ces solutions peuvent vous intéresser</h4>
+        <h4 class="solution-title text-center">
+          Ces solutions peuvent vous intéresser
+        </h4>
       </v-col>
     </v-row>
-  
+
     <v-row class="row-artist">
       <v-col cols="3">
-        <v-img
-        src="/images/opentalent_artist_black.png"
-        class="logo"
-        >
-        </v-img>
+        <v-img src="/images/opentalent_artist_black.png" class="logo"> </v-img>
       </v-col>
-      
+
       <v-col cols="2">
         <h5 class="solution-name">Opentalent Artist</h5>
       </v-col>
-  
+
       <v-col cols="7">
         <!-- list v-chip-->
-        <v-chip-group
-        active-class="primary--text"
-        column
-        >
-          <v-chip
-          class="ma-2 chip-custom"
-          label
-          >
+        <v-chip-group active-class="primary--text" column>
+          <v-chip class="ma-2 chip-custom" label>
             <span class="chip-detail">Agenda</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" label>
             <span class="chip-detail">Facturation</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" label>
             <span class="chip-detail">Comptabilité</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" label>
             <span class="chip-detail">Communication</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" label>
             <span class="chip-detail">Site internet</span>
           </v-chip>
-      </v-chip-group>
+        </v-chip-group>
       </v-col>
-  
     </v-row>
-  
+
     <v-row class="row-artist">
       <v-col cols="3">
-        <v-img
-        src="/images/opentalent_manager_black.jpg"
-        class="logo"
-  
-        >
-        </v-img>
+        <v-img src="/images/opentalent_manager_black.jpg" class="logo"> </v-img>
       </v-col>
-      
+
       <v-col cols="2">
         <h5 class="solution-name">Opentalent Manager</h5>
       </v-col>
-  
+
       <v-col cols="7">
         <!-- list v-chip-->
-        <v-chip-group
-        active-class="primary--text"
-        column
-        >
-          <v-chip
-          class="ma-2 chip-custom"
-          color="primary"
-          label
-          >
+        <v-chip-group active-class="primary--text" column>
+          <v-chip class="ma-2 chip-custom" color="primary" label>
             <span class="chip-detail">Agenda</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" color="primary" label>
             <span class="chip-detail">Facturation</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" color="primary" label>
             <span class="chip-detail">Comptabilité</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" color="primary" label>
             <span class="chip-detail">Communication</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" color="primary" label>
             <span class="chip-detail">Site internet</span>
           </v-chip>
-      </v-chip-group>
+        </v-chip-group>
       </v-col>
-  
     </v-row>
   </LayoutContainer>
-  
-  </template>
-  
-  <script setup>
-  </script>
-  
-  <style scoped>
-  
-  .chip-detail{
-    color: #000000;
-  }
-  .chip-custom {
-    color:white;
-    border: 1px solid #0E2D32;
-    border-radius: 3rem; 
-    text-transform: uppercase;
-  
-  font-family: 'Barlow';
+</template>
+
+<script setup></script>
+
+<style scoped>
+.chip-detail {
+  color: #000000;
+}
+.chip-custom {
+  color: white;
+  border: 1px solid #0e2d32;
+  border-radius: 3rem;
+  text-transform: uppercase;
+
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 500;
   font-size: 14px;
   line-height: 16px;
-  
+
   display: flex;
   align-items: center;
   text-align: center;
   letter-spacing: 0.2em;
-  }
-  
-  .row-artist{
-    border-top: 1px solid #D1CDC7;
-    margin-left: 2rem;
-    margin-right: 2rem;
-  }
-  
-  
-  .solution-name{
-    font-family: 'Barlow';
+}
+
+.row-artist {
+  border-top: 1px solid #d1cdc7;
+  margin-left: 2rem;
+  margin-right: 2rem;
+}
+
+.solution-name {
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 300;
   font-size: 1.5rem;
   line-height: 1.5rem;
-  color: #0E2D32;
-  
-  
-  }
-  
-  .row-artist{
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-  }
-  .solution-title{
-    font-family: "Barlow";
-    font-style: normal;
-    font-weight: 500;
-    font-size: 1.5rem;
-    line-height: 1.5rem;
-    color: #000000;
-    margin-top: 2rem;
-    margin-bottom: 2rem;
-    text-align: center;
-  
-  }
-  
-  .logo{
-    width: 10rem;
-    height: 10rem;
-    margin-left: 2rem;
-    margin-right: 2rem;
-  }
-  </style>
+  color: #0e2d32;
+}
+
+.row-artist {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+.solution-title {
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 500;
+  font-size: 1.5rem;
+  line-height: 1.5rem;
+  color: #000000;
+  margin-top: 2rem;
+  margin-bottom: 2rem;
+  text-align: center;
+}
+
+.logo {
+  width: 10rem;
+  height: 10rem;
+  margin-left: 2rem;
+  margin-right: 2rem;
+}
+</style>

+ 1 - 1
components/Logiciels/Manager/Agenda.vue

@@ -24,7 +24,7 @@
           </v-img>
         </v-card>
       </v-col>
-      
+
       <v-col cols="4">
         <v-card>
           <v-img

+ 59 - 58
components/Logiciels/Manager/Avantages.vue

@@ -1,62 +1,65 @@
 <template>
   <div id="Avantages">
-  <LayoutContainer>
-    <v-row>
-      <div class="d-flex justify-center align-center">
-        <v-icon size="10" class="fa-solid fa-circle icon-title"></v-icon>
-        <h5 class="subtitle-avantage">Découvrez les avantages de la solution</h5>
-
-      </div>
-    </v-row>
-    <v-row>
-      <h3 class="title">Des avantages concrets</h3>
-    </v-row>
-
-    <v-row class="row">
-      <v-col cols="4">
-        <div class="title-card">
-          <h4 class="description-card">Une gestion collaborative</h4>
-          <span class="number-card">03</span>
+    <LayoutContainer>
+      <v-row>
+        <div class="d-flex justify-center align-center">
+          <v-icon size="10" class="fa-solid fa-circle icon-title"></v-icon>
+          <h5 class="subtitle-avantage">
+            Découvrez les avantages de la solution
+          </h5>
         </div>
+      </v-row>
+      <v-row>
+        <h3 class="title">Des avantages concrets</h3>
+      </v-row>
 
-        <hr />
-        <p class="details-card"> Centralisez toutes vos informations sur un seul et même outil et ne
-          perdez plus de temps avec des fichiers sur diverses applications.
-        </p>
-      </v-col>
-      <v-col cols="4">
-        <div class="title-card">
-          <h4>Une gestion collaborative</h4>
-          <span class="number-card">03</span>
-        </div>
+      <v-row class="row">
+        <v-col cols="4">
+          <div class="title-card">
+            <h4 class="description-card">Une gestion collaborative</h4>
+            <span class="number-card">03</span>
+          </div>
 
-        <hr />
-        <p class="details-card"> Centralisez toutes vos informations sur un seul et même outil et ne
-          perdez plus de temps avec des fichiers sur diverses applications.
-        </p>
-        <p><v-chip class="chip-card">Membre cmf</v-chip></p>
-        <v-img src="/images/logiciels/school/screen3.png"></v-img>
-      </v-col>
-      <v-col cols="4">
-        <div class="title-card">
-          <h4>Une gestion collaborative</h4>
-          <span class="number-card">03</span>
-        </div>
-        <hr />
-        <p class="details-card"> Centralisez toutes vos informations sur un seul et même outil et ne
-          perdez plus de temps avec des fichiers sur diverses applications.
-        </p>
-      </v-col>
-    </v-row>
+          <hr />
+          <p class="details-card">
+            Centralisez toutes vos informations sur un seul et même outil et ne
+            perdez plus de temps avec des fichiers sur diverses applications.
+          </p>
+        </v-col>
+        <v-col cols="4">
+          <div class="title-card">
+            <h4>Une gestion collaborative</h4>
+            <span class="number-card">03</span>
+          </div>
 
-  </LayoutContainer>
-</div>
+          <hr />
+          <p class="details-card">
+            Centralisez toutes vos informations sur un seul et même outil et ne
+            perdez plus de temps avec des fichiers sur diverses applications.
+          </p>
+          <p><v-chip class="chip-card">Membre cmf</v-chip></p>
+          <v-img src="/images/logiciels/school/screen3.png"></v-img>
+        </v-col>
+        <v-col cols="4">
+          <div class="title-card">
+            <h4>Une gestion collaborative</h4>
+            <span class="number-card">03</span>
+          </div>
+          <hr />
+          <p class="details-card">
+            Centralisez toutes vos informations sur un seul et même outil et ne
+            perdez plus de temps avec des fichiers sur diverses applications.
+          </p>
+        </v-col>
+      </v-row>
+    </LayoutContainer>
+  </div>
 </template>
 
 <script setup></script>
 
 <style scoped>
-.v-chip{
+.v-chip {
   background: white;
   color: black;
   margin-top: 2rem;
@@ -64,29 +67,28 @@
 }
 
 .details-card {
-  font-family: 'Barlow';
+  font-family: "Barlow";
   font-style: normal;
   font-weight: normal;
   font-size: 1rem;
-  color: #091D20;
+  color: #091d20;
   margin-top: 1rem;
 }
 .number-card {
-  font-family: 'Barlow';
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 500;
   font-size: 1.3rem;
-  color: #E34461;
+  color: #e34461;
 }
 
-
 /** pour title-card : flex avec un espaece between */
 .title-card {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
-  font-family: 'Barlow';
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 600;
   font-size: 1.3rem;
@@ -100,17 +102,16 @@
 }
 
 .title {
-  font-family: 'Barlow';
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 600;
   font-size: 2rem;
   margin-left: 2rem;
   margin-top: 1rem;
-
 }
 
 .subtitle-avantage {
-  font-family: 'Barlow';
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 600;
   font-size: 0.9rem;
@@ -119,7 +120,7 @@
 }
 
 .icon-title {
-  color: #D8050B;
+  color: #d8050b;
   font-size: 1.5rem;
   margin-left: 2rem;
 }

+ 4 - 6
components/Logiciels/Manager/Banner.vue

@@ -43,18 +43,16 @@
         </div>
       </v-col>
     </v-row>
-
   </LayoutContainer>
 </template>
 
 <script setup>
 const state = ref({
   activeMenu: "Présentation",
-})
-
+});
 </script>
 
-<style scoped >
+<style scoped>
 .container-title {
   display: flex;
   justify-content: space-around;
@@ -132,9 +130,9 @@ const state = ref({
   right: 0;
   width: 13rem;
   height: 10rem;
-  background: #D8050B;
+  background: #d8050b;
   opacity: 0.9;
-  color:white;
+  color: white;
 }
 
 .white-square {

+ 33 - 36
components/Logiciels/Manager/FAQ.vue

@@ -4,41 +4,41 @@
       <v-row>
         <v-col cols="6">
           <div class="container-left">
-
             <div class="container-title">
-            <v-icon class="fa-brands fa-react icon-title"></v-icon>
-            <h5 class="subtitle-faq">
-              Vous voulez tirer le meilleur de notre logiciel ?
-            </h5>
-          </div>
-          <h3 class="title-faq">
-            Quelle que soit votre demande, notre équipe est à vos côtés pour
-            vous guider
-          </h3>
-
-          <v-btn class="btn-faq"> Consulter notre FAQ </v-btn>
+              <v-icon class="fa-brands fa-react icon-title"></v-icon>
+              <h5 class="subtitle-faq">
+                Vous voulez tirer le meilleur de notre logiciel ?
+              </h5>
+            </div>
+            <h3 class="title-faq">
+              Quelle que soit votre demande, notre équipe est à vos côtés pour
+              vous guider
+            </h3>
+
+            <v-btn class="btn-faq"> Consulter notre FAQ </v-btn>
           </div>
-
         </v-col>
 
         <v-col cols="6">
-
           <div class="btn-container">
             <v-btn class="btn-faq-tuto">
-            <div class="container-button">
-        <v-icon class="fa-brands fa-react icon-button"></v-icon>
-        <p class="text-btn">De nombreux articles tutoriels accessibles 24h/24</p>
-      </div>
-          </v-btn>
+              <div class="container-button">
+                <v-icon class="fa-brands fa-react icon-button"></v-icon>
+                <p class="text-btn">
+                  De nombreux articles tutoriels accessibles 24h/24
+                </p>
+              </div>
+            </v-btn>
 
-          <v-btn class="btn-faq-tuto">
-            <div class="container-button">
-        <v-icon class="fa-brands fa-react icon-button"></v-icon>
-        <p class="text-btn">De nombreux articles tutoriels accessibles 24h/24</p>
-      </div>
-          </v-btn>
+            <v-btn class="btn-faq-tuto">
+              <div class="container-button">
+                <v-icon class="fa-brands fa-react icon-button"></v-icon>
+                <p class="text-btn">
+                  De nombreux articles tutoriels accessibles 24h/24
+                </p>
+              </div>
+            </v-btn>
           </div>
-
         </v-col>
       </v-row>
     </div>
@@ -48,27 +48,25 @@
 <script setup></script>
 
 <style scoped>
-
-.container-left{
+.container-left {
   margin-left: 6rem;
 }
 
 .text-btn {
-  font-family: 'Barlow';
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 500;
   font-size: 16px;
   line-height: 26px;
-  color: #F0E8E4;
+  color: #f0e8e4;
 }
-.btn-container{
+.btn-container {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: space-between;
   margin-top: 10rem;
   margin-right: 15rem;
-  
 }
 
 .container-button {
@@ -79,13 +77,13 @@
   height: 3.5rem;
 }
 
-.icon-button{
+.icon-button {
   color: #fff;
   font-size: 2rem;
   margin-right: 1rem;
   margin-left: 2rem;
 }
-.btn-faq-tuto{
+.btn-faq-tuto {
   width: 20rem;
   height: 5.5rem;
   margin-left: 3rem;
@@ -102,7 +100,7 @@
   text-transform: none !important;
 }
 
-.subtitle-faq{
+.subtitle-faq {
   font-size: 1.5rem;
   font-weight: 500;
   color: #fff;
@@ -128,7 +126,6 @@
   font-size: 0.8rem;
   text-transform: none !important;
   line-height: 1rem;
-  
 }
 .title-faq {
   font-size: 2rem;

+ 150 - 141
components/Logiciels/Manager/Fonctionnalites.vue

@@ -1,146 +1,156 @@
 <template>
   <div id="Presentation">
-  <LayoutContainer>
-    <div class="container-green">
-    <v-row>
-      <div class="d-flex justify-center align-center">
-        <v-icon size="10" class="fa-solid fa-circle icon-title"></v-icon>
-      <h4 class="subtitle-fontionnalite">Découvrez toutes les foncitonnalités de notre solution</h4>
+    <LayoutContainer>
+      <div class="container-green">
+        <v-row>
+          <div class="d-flex justify-center align-center">
+            <v-icon size="10" class="fa-solid fa-circle icon-title"></v-icon>
+            <h4 class="subtitle-fontionnalite">
+              Découvrez toutes les foncitonnalités de notre solution
+            </h4>
+          </div>
+        </v-row>
+
+        <v-row>
+          <h2 class="title-fonctionnalite">
+            Des fonctionnalités adaptées à vos besoins
+          </h2>
+        </v-row>
+
+        <v-row>
+          <v-col cols="3">
+            <div class="details-container">
+              <v-icon class="fa-brands fa-react icon-details"></v-icon>
+              <h6 class="title-details">
+                Bénéficiez d’un espace dédié pour chacun
+              </h6>
+              <ul class="list-details">
+                <li>Accès admin</li>
+                <li>Accès professeurs</li>
+                <li>Accès élèves/familles</li>
+              </ul>
+            </div>
+          </v-col>
+
+          <v-col cols="3">
+            <div class="details-container">
+              <v-icon class="fa-brands fa-react icon-details"></v-icon>
+              <h6 class="title-details">
+                Bénéficiez d’un espace dédié pour chacun
+              </h6>
+              <ul class="list-details">
+                <li>Accès admin</li>
+                <li>Accès professeurs</li>
+                <li>Accès élèves/familles</li>
+              </ul>
+            </div>
+          </v-col>
+
+          <v-col cols="3">
+            <div class="details-container">
+              <v-icon class="fa-brands fa-react icon-details"></v-icon>
+              <h6 class="title-details">
+                Bénéficiez d’un espace dédié pour chacun
+              </h6>
+              <ul class="list-details">
+                <li>Accès admin</li>
+                <li>Accès professeurs</li>
+                <li>Accès élèves/familles</li>
+              </ul>
+            </div>
+          </v-col>
+
+          <v-col cols="3">
+            <div class="details-container">
+              <v-icon class="fa-brands fa-react icon-details"></v-icon>
+              <h6 class="title-details">
+                Bénéficiez d’un espace dédié pour chacun
+              </h6>
+              <ul class="list-details">
+                <li>Accès admin</li>
+                <li>Accès professeurs</li>
+                <li>Accès élèves/familles</li>
+              </ul>
+            </div>
+          </v-col>
+        </v-row>
+
+        <v-row>
+          <v-col cols="3">
+            <div class="details-container">
+              <v-icon class="fa-brands fa-react icon-details"></v-icon>
+              <h6 class="title-details">
+                Bénéficiez d’un espace dédié pour chacun
+              </h6>
+              <ul class="list-details">
+                <li>Accès admin</li>
+                <li>Accès professeurs</li>
+                <li>Accès élèves/familles</li>
+              </ul>
+            </div>
+          </v-col>
+
+          <v-col cols="3">
+            <div class="details-container">
+              <v-icon class="fa-brands fa-react icon-details"></v-icon>
+              <h6 class="title-details">
+                Bénéficiez d’un espace dédié pour chacun
+              </h6>
+              <ul class="list-details">
+                <li>Accès admin</li>
+                <li>Accès professeurs</li>
+                <li>Accès élèves/familles</li>
+              </ul>
+            </div>
+          </v-col>
+
+          <v-col cols="3">
+            <div class="details-container">
+              <v-icon class="fa-brands fa-react icon-details"></v-icon>
+              <h6 class="title-details">
+                Bénéficiez d’un espace dédié pour chacun
+              </h6>
+              <ul class="list-details">
+                <li>Accès admin</li>
+                <li>Accès professeurs</li>
+                <li>Accès élèves/familles</li>
+              </ul>
+            </div>
+          </v-col>
+
+          <v-col cols="3">
+            <div class="details-container">
+              <v-icon class="fa-brands fa-react icon-details"></v-icon>
+              <h6 class="title-details">
+                Bénéficiez d’un espace dédié pour chacun
+              </h6>
+              <ul class="list-details">
+                <li>Accès admin</li>
+                <li>Accès professeurs</li>
+                <li>Accès élèves/familles</li>
+              </ul>
+            </div>
+          </v-col>
+        </v-row>
       </div>
-    </v-row>
-
-    <v-row>
-      <h2 class="title-fonctionnalite">Des fonctionnalités adaptées à vos besoins</h2>
-    </v-row>
-
-    <v-row>
-      <v-col cols="3">
-        <div class="details-container">
-          <v-icon class="fa-brands fa-react icon-details"></v-icon>
-          <h6 class="title-details">Bénéficiez d’un espace dédié pour chacun</h6>
-        <ul class="list-details">
-          <li>Accès admin</li>
-          <li>Accès professeurs</li>
-          <li>Accès élèves/familles</li>
-        </ul>
-        </div>
-
-      </v-col>
-
-      <v-col cols="3">
-        <div class="details-container">
-          <v-icon class="fa-brands fa-react icon-details"></v-icon>
-          <h6 class="title-details">Bénéficiez d’un espace dédié pour chacun</h6>
-        <ul class="list-details">
-          <li>Accès admin</li>
-          <li>Accès professeurs</li>
-          <li>Accès élèves/familles</li>
-        </ul>
-        </div>
-
-      </v-col>
-
-      <v-col cols="3">
-        <div class="details-container">
-          <v-icon class="fa-brands fa-react icon-details"></v-icon>
-          <h6 class="title-details">Bénéficiez d’un espace dédié pour chacun</h6>
-        <ul class="list-details">
-          <li>Accès admin</li>
-          <li>Accès professeurs</li>
-          <li>Accès élèves/familles</li>
-        </ul>
-        </div>
-
-      </v-col>
-
-      <v-col cols="3">
-        <div class="details-container">
-          <v-icon class="fa-brands fa-react icon-details"></v-icon>
-          <h6 class="title-details">Bénéficiez d’un espace dédié pour chacun</h6>
-        <ul class="list-details">
-          <li>Accès admin</li>
-          <li>Accès professeurs</li>
-          <li>Accès élèves/familles</li>
-        </ul>
-        </div>
-
-      </v-col>
-    </v-row>
-
-    <v-row>
-      <v-col cols="3">
-        <div class="details-container">
-          <v-icon class="fa-brands fa-react icon-details"></v-icon>
-          <h6 class="title-details">Bénéficiez d’un espace dédié pour chacun</h6>
-        <ul class="list-details">
-          <li>Accès admin</li>
-          <li>Accès professeurs</li>
-          <li>Accès élèves/familles</li>
-        </ul>
-        </div>
-
-      </v-col>
-
-      <v-col cols="3">
-        <div class="details-container">
-          <v-icon class="fa-brands fa-react icon-details"></v-icon>
-          <h6 class="title-details">Bénéficiez d’un espace dédié pour chacun</h6>
-        <ul class="list-details">
-          <li>Accès admin</li>
-          <li>Accès professeurs</li>
-          <li>Accès élèves/familles</li>
-        </ul>
-        </div>
-
-      </v-col>
-
-      <v-col cols="3">
-        <div class="details-container">
-          <v-icon class="fa-brands fa-react icon-details"></v-icon>
-          <h6 class="title-details">Bénéficiez d’un espace dédié pour chacun</h6>
-        <ul class="list-details">
-          <li>Accès admin</li>
-          <li>Accès professeurs</li>
-          <li>Accès élèves/familles</li>
-        </ul>
-        </div>
-
-      </v-col>
-
-      <v-col cols="3">
-        <div class="details-container">
-          <v-icon class="fa-brands fa-react icon-details"></v-icon>
-          <h6 class="title-details">Bénéficiez d’un espace dédié pour chacun</h6>
-        <ul class="list-details">
-          <li>Accès admin</li>
-          <li>Accès professeurs</li>
-          <li>Accès élèves/familles</li>
-        </ul>
-        </div>
-
-      </v-col>
-    </v-row>
+    </LayoutContainer>
   </div>
-  </LayoutContainer>
-</div>
 </template>
 
-<script setup>
-</script>
+<script setup></script>
 
 <style scoped>
-
-.list-details{
-  font-family: 'Barlow';
-font-style: normal;
-font-weight: 300;
-font-size: 0.75rem;
-line-height: 0.9rem;
-margin-left: 1rem;
-margin-bottom: 1rem;
-color: #FFFFFF;
+.list-details {
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 300;
+  font-size: 0.75rem;
+  line-height: 0.9rem;
+  margin-left: 1rem;
+  margin-bottom: 1rem;
+  color: #ffffff;
 }
-.title-details{
+.title-details {
   font-family: "Barlow";
   font-style: normal;
   font-weight: 500;
@@ -150,13 +160,13 @@ color: #FFFFFF;
 .icon-details {
   font-size: 1.5rem;
   margin-bottom: 0.9rem;
-  color: #D8050B;
+  color: #d8050b;
 }
 
-.icon-title{
+.icon-title {
   font-size: 0.8rem;
   margin-bottom: 2rem;
-  color: #D8050B;
+  color: #d8050b;
 }
 
 .subtitle-fontionnalite {
@@ -181,10 +191,9 @@ color: #FFFFFF;
   margin-bottom: 2rem;
 }
 
-
 .container-green {
-  background-color: #0E2D32;
+  background-color: #0e2d32;
   padding: 5rem;
-  color: #EFF9FB;
+  color: #eff9fb;
 }
-</style>
+</style>

+ 8 - 10
components/Logiciels/Manager/MenuScroll.vue

@@ -17,14 +17,14 @@
 import { ref } from "vue";
 
 const menus = [
-  { label: 'Presentation' },
-  { label: 'Avantages' },
-  { label: 'Comparatif' },
-  { label: 'détails' },
-  { label: 'abonnement' },
-  { label: 'témoignages' },
-  { label: 'formations' },
-  { label: 'solutions' }
+  { label: "Presentation" },
+  { label: "Avantages" },
+  { label: "Comparatif" },
+  { label: "détails" },
+  { label: "abonnement" },
+  { label: "témoignages" },
+  { label: "formations" },
+  { label: "solutions" },
 ];
 
 const activeMenu = ref(menus[0].label);
@@ -65,6 +65,4 @@ const navigate = (menu) => {
   cursor: pointer;
   text-decoration: underline;
 }
-
-
 </style>

+ 145 - 146
components/Logiciels/Manager/Outil.vue

@@ -1,164 +1,163 @@
 <template>
   <div id="Presentation">
-  <LayoutContainer>
-    <v-row class="outil-row">
-      <v-col cols="4">
-        <div class="title-presentation">
-          <v-icon size="10" class="fa-solid fa-circle icon-title"></v-icon>
-          <h4>Présentation d'opentalent manager</h4>
-        </div>
-        <v-img src="/images/logiciels/school/screen.jpg" class="screen-img">
-        </v-img>
-        
-        <div class="rectangle-4">
-          <div class="black-circle">
-            <div class="content-flex">
-              <v-img
-                src="/images/OpenTalent_LogoNoir_rouge_manager_white.png"
-                class="logo-manager"
-              >
-              </v-img>
-              <p class="devis">Sur devis</p>
-            </div>
+    <LayoutContainer>
+      <v-row class="outil-row">
+        <v-col cols="4">
+          <div class="title-presentation">
+            <v-icon size="10" class="fa-solid fa-circle icon-title"></v-icon>
+            <h4>Présentation d'opentalent manager</h4>
           </div>
-        </div>
-      </v-col>
-
-      <v-col cols="5">
-        <h2 class="outil-title">
-          La solution de mise en réseau des organisations culturelles
-        </h2>
-        <ul class="outil-ul">
-          <li class="outil-list">
-            Logiciel de gestion et communication en ligne
-          </li>
-          <li class="outil-list">
-            Répond aux besoin globaux des réseaux culturels
-          </li>
-          <li class="outil-list">Gestion collaborative</li>
-          <li class="outil-list">
-            Mise en valeur des activités des membres du réseau
-          </li>
-        </ul>
-      </v-col>
-
-      <v-col cols="3">
-        <div class="container-square">
-          <v-row>
-            <div class="red-square">
-              <v-icon class="fa-regular fa-comments icon"></v-icon>
-              <p class="text-square">Nous contacter</p>
-            </div>
-          </v-row>
-
-          <v-row>
-            <div class="red-square">
-              <v-icon class="fa-brands fa-readme icon"></v-icon>
-              <p class="text-square">Brochure</p>
+          <v-img src="/images/logiciels/school/screen.jpg" class="screen-img">
+          </v-img>
+
+          <div class="rectangle-4">
+            <div class="black-circle">
+              <div class="content-flex">
+                <v-img
+                  src="/images/OpenTalent_LogoNoir_rouge_manager_white.png"
+                  class="logo-manager"
+                >
+                </v-img>
+                <p class="devis">Sur devis</p>
+              </div>
             </div>
-          </v-row>
-
-          <v-row>
-            <div class="darkblue-square">
-              <v-icon class="fa-solid fa-phone icon"></v-icon>
-              <p class="text-square">Nous Appeler</p>
-            </div>
-          </v-row>
-        </div>
-      </v-col>
-      <v-row>
-        <v-col cols="4"> </v-col>
+          </div>
+        </v-col>
 
         <v-col cols="5">
-          <h2>Des caractéristiques uniques & dédiées</h2>
-          <div class="picto-container">
-            <div class="picto-group">
-              <v-img
-                class="picto-img"
-                src="/images/logiciels/manager/picto1.png"
-              ></v-img>
-              <p class="picto-text">
-                Logiciel de gestion & communication full web
-              </p>
-            </div>
-
-            <div class="picto-group">
-              <v-img
-                class="picto-img"
-                src="/images/logiciels/manager/picto2.png"
-              ></v-img>
-              <p class="picto-text">
-                Boostez votre visibilité & votre communication
-              </p>
-            </div>
-
-            <div class="picto-group">
-              <v-img
-                class="picto-img"
-                src="/images/logiciels/manager/picto3.png"
-              ></v-img>
-              <p class="picto-text">
-                Boostez votre visibilité & votre communication
-              </p>
-            </div>
+          <h2 class="outil-title">
+            La solution de mise en réseau des organisations culturelles
+          </h2>
+          <ul class="outil-ul">
+            <li class="outil-list">
+              Logiciel de gestion et communication en ligne
+            </li>
+            <li class="outil-list">
+              Répond aux besoin globaux des réseaux culturels
+            </li>
+            <li class="outil-list">Gestion collaborative</li>
+            <li class="outil-list">
+              Mise en valeur des activités des membres du réseau
+            </li>
+          </ul>
+        </v-col>
 
-            <div class="picto-group">
-              <v-img
-                class="picto-img"
-                src="/images/logiciels/manager/picto4.png"
-              ></v-img>
-              <p class="picto-text">Communiquez en réseau</p>
+        <v-col cols="3">
+          <div class="container-square">
+            <v-row>
+              <div class="red-square">
+                <v-icon class="fa-regular fa-comments icon"></v-icon>
+                <p class="text-square">Nous contacter</p>
+              </div>
+            </v-row>
+
+            <v-row>
+              <div class="red-square">
+                <v-icon class="fa-brands fa-readme icon"></v-icon>
+                <p class="text-square">Brochure</p>
+              </div>
+            </v-row>
+
+            <v-row>
+              <div class="darkblue-square">
+                <v-icon class="fa-solid fa-phone icon"></v-icon>
+                <p class="text-square">Nous Appeler</p>
+              </div>
+            </v-row>
+          </div>
+        </v-col>
+        <v-row>
+          <v-col cols="4"> </v-col>
+
+          <v-col cols="5">
+            <h2>Des caractéristiques uniques & dédiées</h2>
+            <div class="picto-container">
+              <div class="picto-group">
+                <v-img
+                  class="picto-img"
+                  src="/images/logiciels/manager/picto1.png"
+                ></v-img>
+                <p class="picto-text">
+                  Logiciel de gestion & communication full web
+                </p>
+              </div>
+
+              <div class="picto-group">
+                <v-img
+                  class="picto-img"
+                  src="/images/logiciels/manager/picto2.png"
+                ></v-img>
+                <p class="picto-text">
+                  Boostez votre visibilité & votre communication
+                </p>
+              </div>
+
+              <div class="picto-group">
+                <v-img
+                  class="picto-img"
+                  src="/images/logiciels/manager/picto3.png"
+                ></v-img>
+                <p class="picto-text">
+                  Boostez votre visibilité & votre communication
+                </p>
+              </div>
+
+              <div class="picto-group">
+                <v-img
+                  class="picto-img"
+                  src="/images/logiciels/manager/picto4.png"
+                ></v-img>
+                <p class="picto-text">Communiquez en réseau</p>
+              </div>
+
+              <div class="picto-group">
+                <v-img
+                  class="picto-img"
+                  src="/images/logiciels/manager/picto5.png"
+                ></v-img>
+                <p class="picto-text">Sur-Mesure</p>
+              </div>
+
+              <div class="picto-group">
+                <v-img
+                  class="picto-img"
+                  src="/images/logiciels/manager/picto6.png"
+                ></v-img>
+                <p class="picto-text">Pour tout réseau de type pyramidal</p>
+              </div>
             </div>
+          </v-col>
 
-            <div class="picto-group">
-              <v-img
-                class="picto-img"
-                src="/images/logiciels/manager/picto5.png"
-              ></v-img>
-              <p class="picto-text">Sur-Mesure</p>
-            </div>
+          <v-col cols="2"> </v-col>
+        </v-row>
+      </v-row>
 
-            <div class="picto-group">
-              <v-img
-                class="picto-img"
-                src="/images/logiciels/manager/picto6.png"
-              ></v-img>
-              <p class="picto-text">Pour tout réseau de type pyramidal</p>
-            </div>
+      <v-row class="container-green">
+        <v-row>
+          <v-col cols="6" class="citation-school">
+            “ Pour les petits comme pour les grands établissements
+            d’enseignement artistique.“</v-col
+          >
+        </v-row>
+
+        <v-col cols="6">
+          <div class="title-logiciel-group">
+            <v-icon size="10" class="fa-solid fa-circle icon-logiciel"></v-icon>
+            <h6 class="subtitle-logiciel">Logiciel Opentalent</h6>
           </div>
-        </v-col>
 
-        <v-col cols="2"> </v-col>
-      </v-row>
-    </v-row>
-
-    <v-row class="container-green">
-      <v-row>
-        <v-col cols="6" class="citation-school">
-          “ Pour les petits comme pour les grands établissements d’enseignement
-          artistique.“</v-col
-        >
+          <v-img src="/images/logiciels/school/screen2.png" class="screen2-img">
+          </v-img>
+        </v-col>
       </v-row>
-
-      <v-col cols="6">
-        <div class="title-logiciel-group">
-          <v-icon size="10" class="fa-solid fa-circle icon-logiciel"></v-icon>
-        <h6 class="subtitle-logiciel">Logiciel Opentalent</h6>
-        </div>
-
-        <v-img src="/images/logiciels/school/screen2.png" class="screen2-img">
-        </v-img>
-      </v-col>
-    </v-row>
-  </LayoutContainer>
-</div>
+    </LayoutContainer>
+  </div>
 </template>
 
 <script setup></script>
 
 <style scoped>
-
-.title-presentation{
+.title-presentation {
   display: flex;
   justify-content: center;
   align-items: center;
@@ -171,7 +170,7 @@
   line-height: 1.5rem;
 }
 
-.title-logiciel-group{
+.title-logiciel-group {
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -286,14 +285,14 @@
 
 .icon-logiciel {
   font-size: 2rem;
-  color:#D8050B;
+  color: #d8050b;
   margin-left: 5rem;
   margin-top: 4rem;
 }
 
 .icon-title {
   margin-right: 1.5rem;
-  color:#D8050B;
+  color: #d8050b;
 }
 .subtitle-logiciel {
   font-family: "Barlow";

+ 9 - 10
components/Logiciels/Manager/Projet.vue

@@ -42,23 +42,23 @@
       </v-col>
     </v-row>
 
-    <v-row >
-      <v-col cols="4" class="border" >
-        <div class="d-flex justify-center align-center ">
-          <v-icon  class="fa-brands fa-react icon"></v-icon>
+    <v-row>
+      <v-col cols="4" class="border">
+        <div class="d-flex justify-center align-center">
+          <v-icon class="fa-brands fa-react icon"></v-icon>
         </div>
         <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
       </v-col>
       <v-col cols="4" class="border">
         <div class="d-flex justify-center align-center">
-          <v-icon  class="fa-brands fa-react icon"></v-icon>
+          <v-icon class="fa-brands fa-react icon"></v-icon>
         </div>
         <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
       </v-col>
 
       <v-col cols="4" class="border">
         <div class="d-flex justify-center align-center">
-          <v-icon  class="fa-brands fa-react icon"></v-icon>
+          <v-icon class="fa-brands fa-react icon"></v-icon>
         </div>
         <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
       </v-col>
@@ -69,15 +69,14 @@
 <script setup></script>
 
 <style scoped>
-
-.border{
+.border {
   border-top: 1px solid #000; /* Remplacez #000 par la couleur de votre choix */
   border-right: 1px solid #000; /* Remplacez #000 par la couleur de votre choix */
 }
 
-.icon{
+.icon {
   font-size: 3rem;
-  color: #0E2D32;
+  color: #0e2d32;
 }
 .femme-casque {
   width: 20rem;

+ 54 - 55
components/Logiciels/Manager/Pyramide.vue

@@ -1,78 +1,77 @@
 <template>
   <div id="détails">
-  <LayoutContainer>
-    <v-row>
-      <div class="d-flex justify-center align-center">
-        <v-icon class="fa-brands fa-react icon-title"></v-icon>
-        <h4 class="subtitle-pyramide">Un réseau pyramidal</h4>
-      </div>
-    </v-row>
-
-    <v-row>
-      <v-col cols="4">
-        <div class="row-pyramide">
-          <h4 class="title-pyramide">Opentalent Manager, un logiciel adapté à chacun</h4>
-        <p class="detail-pyramide">
-          Notre système s'adapte à toutes les structures de réseau pyramidal,
-          quel que soit le nombre de niveau.
-        </p>
+    <LayoutContainer>
+      <v-row>
+        <div class="d-flex justify-center align-center">
+          <v-icon class="fa-brands fa-react icon-title"></v-icon>
+          <h4 class="subtitle-pyramide">Un réseau pyramidal</h4>
         </div>
+      </v-row>
 
-      </v-col>
+      <v-row>
+        <v-col cols="4">
+          <div class="row-pyramide">
+            <h4 class="title-pyramide">
+              Opentalent Manager, un logiciel adapté à chacun
+            </h4>
+            <p class="detail-pyramide">
+              Notre système s'adapte à toutes les structures de réseau
+              pyramidal, quel que soit le nombre de niveau.
+            </p>
+          </div>
+        </v-col>
 
-      <v-col cols="8">
-        <v-img
-        src="/images/logiciels/manager/schema_manager.png"
-        class="schema-manager"
-        >
+        <v-col cols="8">
+          <v-img
+            src="/images/logiciels/manager/schema_manager.png"
+            class="schema-manager"
+          >
+          </v-img>
+        </v-col>
+      </v-row>
 
-        </v-img>
-      </v-col>
-    </v-row>
+      <v-row>
+        <v-col cols="4" class="border">
+          <div class="d-flex justify-center align-center">
+            <v-icon class="fa-brands fa-react icon"></v-icon>
+          </div>
+          <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
+        </v-col>
+        <v-col cols="4" class="border">
+          <div class="d-flex justify-center align-center">
+            <v-icon class="fa-brands fa-react icon"></v-icon>
+          </div>
+          <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
+        </v-col>
 
-    <v-row >
-      <v-col cols="4" class="border" >
-        <div class="d-flex justify-center align-center ">
-          <v-icon  class="fa-brands fa-react icon"></v-icon>
-        </div>
-        <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
-      </v-col>
-      <v-col cols="4" class="border">
-        <div class="d-flex justify-center align-center">
-          <v-icon  class="fa-brands fa-react icon"></v-icon>
-        </div>
-        <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
-      </v-col>
-
-      <v-col cols="4" class="border">
-        <div class="d-flex justify-center align-center">
-          <v-icon  class="fa-brands fa-react icon"></v-icon>
-        </div>
-        <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
-      </v-col>
-    </v-row>
-  </LayoutContainer>
-</div>
+        <v-col cols="4" class="border">
+          <div class="d-flex justify-center align-center">
+            <v-icon class="fa-brands fa-react icon"></v-icon>
+          </div>
+          <p class="d-flex justify-center align-center">Paiement Sécurisé</p>
+        </v-col>
+      </v-row>
+    </LayoutContainer>
+  </div>
 </template>
 
 <script setup></script>
 
 <style scoped>
-
-.icon{
+.icon {
   font-size: 3rem;
-  color: #0E2D32;
+  color: #0e2d32;
 }
-.schema-manager{
+.schema-manager {
   width: 70%;
   height: 100%;
 }
 
-.row-pyramide{
+.row-pyramide {
   margin-left: 2rem;
 }
 
-.detail-pyramide{
+.detail-pyramide {
   font-family: "Barlow";
   font-style: normal;
   font-weight: 400;
@@ -82,7 +81,7 @@
   margin-bottom: 1rem;
   width: 22rem;
 }
-.title-pyramide{
+.title-pyramide {
   font-family: "Barlow";
   font-style: normal;
   font-weight: 600;

+ 35 - 37
components/Logiciels/Manager/Reviews.vue

@@ -6,44 +6,43 @@
           <v-col cols="4">
             <h3 class="reviews-title">C'est eux qui en parlent le mieux</h3>
             <div class="d-flex justify-center align-center">
-          <div class="carousel-button" @click="goPrevious">
-            <i class="fas fa-chevron-left"></i>
-          </div>
-          <div class="carousel-button" @click="goNext">
-            <i class="fas fa-chevron-right"></i>
-          </div>
-        </div>
+              <div class="carousel-button" @click="goPrevious">
+                <i class="fas fa-chevron-left"></i>
+              </div>
+              <div class="carousel-button" @click="goNext">
+                <i class="fas fa-chevron-right"></i>
+              </div>
+            </div>
           </v-col>
 
           <v-col cols="8">
             <Carousel
-          :itemsToShow="3"
-          :itemsToScroll="1"
-          v-slot="{ carousel: _carousel }"
-          ref="carousel"
-        >
-          <Slide class="card" v-for="(card, index) in cards" :key="index">
-
-            <div class="card-container">
-              <v-card >
-                <v-card-item>
-                  <v-card-text class="review-description">
-                    {{ card.description }}
-                  </v-card-text>
-
-                  <div class="card-footer">
-                    <v-card-actions class="reviewer-name">
-                      {{ card.name }}
-                    </v-card-actions>
-
-                    <p class="reviewer-status">{{ card.status }}</p>
-                    <p class="reviewer-structure">{{ card.structure }}</p>
-                  </div>
-                </v-card-item>
-              </v-card>
-            </div>
-          </Slide>
-        </Carousel>
+              :itemsToShow="3"
+              :itemsToScroll="1"
+              v-slot="{ carousel: _carousel }"
+              ref="carousel"
+            >
+              <Slide class="card" v-for="(card, index) in cards" :key="index">
+                <div class="card-container">
+                  <v-card>
+                    <v-card-item>
+                      <v-card-text class="review-description">
+                        {{ card.description }}
+                      </v-card-text>
+
+                      <div class="card-footer">
+                        <v-card-actions class="reviewer-name">
+                          {{ card.name }}
+                        </v-card-actions>
+
+                        <p class="reviewer-status">{{ card.status }}</p>
+                        <p class="reviewer-structure">{{ card.structure }}</p>
+                      </div>
+                    </v-card-item>
+                  </v-card>
+                </div>
+              </Slide>
+            </Carousel>
           </v-col>
         </v-row>
       </div>
@@ -65,7 +64,6 @@ const goNext = () => {
   carousel.value.next();
 };
 
-
 const cards = [
   {
     description:
@@ -156,7 +154,7 @@ const cards = [
   color: #071b1f;
 }
 
-.review-description{
+.review-description {
   text-align: left;
 }
 .card-footer {
@@ -194,7 +192,7 @@ const cards = [
 
 .card {
   width: 80rem;
-  margin-left: .5rem;
+  margin-left: 0.5rem;
   border-radius: 1rem;
 }
 

+ 1 - 2
components/Logiciels/School/Avantages.vue

@@ -14,7 +14,7 @@
       </v-row>
 
       <v-row class="row">
-        <v-col cols="4"> 
+        <v-col cols="4">
           <div class="title-card">
             <h4 class="description-card">Un gain de temps</h4>
             <span class="number-card">01</span>
@@ -39,7 +39,6 @@
             Des espaces dédiés et des outils spécifiques à vos besoins pour une
             gestion optimisée et une lecture simplifiée.
           </p>
-          
         </v-col>
         <v-col cols="4">
           <div class="title-card">

+ 1 - 4
components/Logiciels/School/Banner.vue

@@ -44,15 +44,12 @@
         </div>
       </v-col>
     </v-row>
-
   </LayoutContainer>
 </template>
 
-<script setup>
-</script>
+<script setup></script>
 
 <style scoped>
-
 .container-title {
   display: flex;
   justify-content: space-around;

+ 7 - 7
components/Logiciels/School/Caroussel.vue

@@ -92,12 +92,12 @@ const items = ref([
   color: black;
   margin-left: 30rem;
   margin-right: 30rem;
-font-family: 'Barlow';
-font-style: normal;
-font-weight: 600;
-font-size: 42px;
-line-height: 42px;
-text-align: center;
-color: #0E2D32;
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 600;
+  font-size: 42px;
+  line-height: 42px;
+  text-align: center;
+  color: #0e2d32;
 }
 </style>

+ 2 - 2
components/Logiciels/School/Fonctionnalites.vue

@@ -80,7 +80,7 @@
               <v-icon class="fa-brands fa-react icon-details"></v-icon>
               <h6 class="title-details">Planifiez vos évènements</h6>
               <ul class="list-details">
-                <li> Gestion intégrée au logiciel</li>
+                <li>Gestion intégrée au logiciel</li>
                 <li>Simplicité d'utilisation</li>
                 <li>Mise à jour automatique</li>
                 <li>Multi-utilisateurs</li>
@@ -131,7 +131,7 @@
               <v-icon class="fa-brands fa-react icon-details"></v-icon>
               <h6 class="title-details">Planifiez vos évènements</h6>
               <ul class="list-details">
-                <li> Gestion intégrée au logiciel</li>
+                <li>Gestion intégrée au logiciel</li>
                 <li>Simplicité d'utilisation</li>
                 <li>Mise à jour automatique</li>
                 <li>Multi-utilisateurs</li>

+ 0 - 2
components/Logiciels/School/MenuScroll.vue

@@ -66,6 +66,4 @@ const navigate = (menu) => {
   cursor: pointer;
   text-decoration: underline;
 }
-
-
 </style>

+ 2 - 2
components/Logiciels/School/Outil.vue

@@ -138,9 +138,9 @@
         <v-col cols="6">
           <div class="subtitle-logiciel">
             <v-icon size="10" class="fa-solid fa-circle icon-logiciel"></v-icon>
-            <h6 >Logiciel Opentalent</h6>
+            <h6>Logiciel Opentalent</h6>
           </div>
-          
+
           <v-img src="/images/logiciels/school/screen2.png" class="screen2-img">
           </v-img>
         </v-col>

+ 0 - 1
components/Logiciels/School/Premium.vue

@@ -155,7 +155,6 @@ const tableData = [
   color: #0e2d32;
   padding-right: 5rem;
   margin-bottom: 1rem;
-
 }
 
 .from,

+ 14 - 11
components/Logiciels/School/Projet.vue

@@ -60,13 +60,17 @@
           <div class="d-flex justify-center align-center">
             <v-icon size="35" class="fa-brands fa-react icon"></v-icon>
           </div>
-          <p class="d-flex justify-center align-center details">Paiement Sécurisé</p>
+          <p class="d-flex justify-center align-center details">
+            Paiement Sécurisé
+          </p>
         </v-col>
         <v-col cols="4" class="border-col">
           <div class="d-flex justify-center align-center">
             <v-icon size="35" class="fa-brands fa-react icon"></v-icon>
           </div>
-          <p class="d-flex justify-center align-center details">Service clef en main</p>
+          <p class="d-flex justify-center align-center details">
+            Service clef en main
+          </p>
         </v-col>
 
         <v-col cols="4" class="border-col">
@@ -85,18 +89,17 @@
 <script setup></script>
 
 <style scoped>
-
-.details{
-  color: var(--vert-100, #091D20);
+.details {
+  color: var(--vert-100, #091d20);
   margin-right: auto;
   margin-left: auto;
   width: 8rem;
-text-align: center;
-margin-top: .7rem;
-font-size: 1rem;
-font-family: "Barlow";
-font-weight: 300;
-line-height: 14px;
+  text-align: center;
+  margin-top: 0.7rem;
+  font-size: 1rem;
+  font-family: "Barlow";
+  font-weight: 300;
+  line-height: 14px;
 }
 .border-col {
   border-top: 1px solid #e5e5e5;

+ 35 - 37
components/Logiciels/School/Reviews.vue

@@ -6,44 +6,43 @@
           <v-col cols="4">
             <h3 class="reviews-title">C'est eux qui en parlent le mieux</h3>
             <div class="d-flex justify-center align-center">
-          <div class="carousel-button" @click="goPrevious">
-            <i class="fas fa-chevron-left"></i>
-          </div>
-          <div class="carousel-button" @click="goNext">
-            <i class="fas fa-chevron-right"></i>
-          </div>
-        </div>
+              <div class="carousel-button" @click="goPrevious">
+                <i class="fas fa-chevron-left"></i>
+              </div>
+              <div class="carousel-button" @click="goNext">
+                <i class="fas fa-chevron-right"></i>
+              </div>
+            </div>
           </v-col>
 
           <v-col cols="8">
             <Carousel
-          :itemsToShow="3"
-          :itemsToScroll="1"
-          v-slot="{ carousel: _carousel }"
-          ref="carousel"
-        >
-          <Slide class="card" v-for="(card, index) in cards" :key="index">
-
-            <div class="card-container">
-              <v-card >
-                <v-card-item>
-                  <v-card-text class="review-description">
-                    {{ card.description }}
-                  </v-card-text>
-
-                  <div class="card-footer">
-                    <v-card-actions class="reviewer-name">
-                      {{ card.name }}
-                    </v-card-actions>
-
-                    <p class="reviewer-status">{{ card.status }}</p>
-                    <p class="reviewer-structure">{{ card.structure }}</p>
-                  </div>
-                </v-card-item>
-              </v-card>
-            </div>
-          </Slide>
-        </Carousel>
+              :itemsToShow="3"
+              :itemsToScroll="1"
+              v-slot="{ carousel: _carousel }"
+              ref="carousel"
+            >
+              <Slide class="card" v-for="(card, index) in cards" :key="index">
+                <div class="card-container">
+                  <v-card>
+                    <v-card-item>
+                      <v-card-text class="review-description">
+                        {{ card.description }}
+                      </v-card-text>
+
+                      <div class="card-footer">
+                        <v-card-actions class="reviewer-name">
+                          {{ card.name }}
+                        </v-card-actions>
+
+                        <p class="reviewer-status">{{ card.status }}</p>
+                        <p class="reviewer-structure">{{ card.structure }}</p>
+                      </div>
+                    </v-card-item>
+                  </v-card>
+                </div>
+              </Slide>
+            </Carousel>
           </v-col>
         </v-row>
       </div>
@@ -65,7 +64,6 @@ const goNext = () => {
   carousel.value.next();
 };
 
-
 const cards = [
   {
     description:
@@ -156,7 +154,7 @@ const cards = [
   color: #071b1f;
 }
 
-.review-description{
+.review-description {
   text-align: left;
 }
 .card-footer {
@@ -194,7 +192,7 @@ const cards = [
 
 .card {
   width: 80rem;
-  margin-left: .5rem;
+  margin-left: 0.5rem;
   border-radius: 1rem;
 }
 

+ 78 - 135
components/Logiciels/School/Solutions.vue

@@ -2,193 +2,136 @@
   <LayoutContainer>
     <v-row>
       <v-col cols="12">
-        <h4 class="solution-title text-center">Ces solutions peuvent vous intéresser</h4>
+        <h4 class="solution-title text-center">
+          Ces solutions peuvent vous intéresser
+        </h4>
       </v-col>
     </v-row>
-  
+
     <v-row class="row-artist">
       <v-col cols="3">
-        <v-img
-        src="/images/opentalent_artist_black.png"
-        class="logo"
-        >
-        </v-img>
+        <v-img src="/images/opentalent_artist_black.png" class="logo"> </v-img>
       </v-col>
-      
+
       <v-col cols="2">
         <h5 class="solution-name">Opentalent Artist</h5>
       </v-col>
-  
+
       <v-col cols="7">
         <!-- list v-chip-->
-        <v-chip-group
-        active-class="primary--text"
-        column
-        >
-          <v-chip
-          class="ma-2 chip-custom"
-          label
-          >
+        <v-chip-group active-class="primary--text" column>
+          <v-chip class="ma-2 chip-custom" label>
             <span class="chip-detail">Agenda</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" label>
             <span class="chip-detail">Facturation</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" label>
             <span class="chip-detail">Comptabilité</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" label>
             <span class="chip-detail">Communication</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" label>
             <span class="chip-detail">Site internet</span>
           </v-chip>
-      </v-chip-group>
+        </v-chip-group>
       </v-col>
-  
     </v-row>
-  
+
     <v-row class="row-artist">
       <v-col cols="3">
-        <v-img
-        src="/images/opentalent_manager_black.jpg"
-        class="logo"
-  
-        >
-        </v-img>
+        <v-img src="/images/opentalent_manager_black.jpg" class="logo"> </v-img>
       </v-col>
-      
+
       <v-col cols="2">
         <h5 class="solution-name">Opentalent Manager</h5>
       </v-col>
-  
+
       <v-col cols="7">
         <!-- list v-chip-->
-        <v-chip-group
-        active-class="primary--text"
-        column
-        >
-          <v-chip
-          class="ma-2 chip-custom"
-          color="primary"
-          label
-          >
+        <v-chip-group active-class="primary--text" column>
+          <v-chip class="ma-2 chip-custom" color="primary" label>
             <span class="chip-detail">Agenda</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" color="primary" label>
             <span class="chip-detail">Facturation</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" color="primary" label>
             <span class="chip-detail">Comptabilité</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" color="primary" label>
             <span class="chip-detail">Communication</span>
           </v-chip>
-          <v-chip
-          class="ma-2 chip-custom"
-          color="primary"
-          label
-          >
+          <v-chip class="ma-2 chip-custom" color="primary" label>
             <span class="chip-detail">Site internet</span>
           </v-chip>
-      </v-chip-group>
+        </v-chip-group>
       </v-col>
-  
     </v-row>
   </LayoutContainer>
-  
-  </template>
-  
-  <script setup>
-  </script>
-  
-  <style scoped>
-  
-  .chip-detail{
-    color: #000000;
-  }
-  .chip-custom {
-    color:white;
-    border: 1px solid #0E2D32;
-    border-radius: 3rem; 
-    text-transform: uppercase;
-  
-  font-family: 'Barlow';
+</template>
+
+<script setup></script>
+
+<style scoped>
+.chip-detail {
+  color: #000000;
+}
+.chip-custom {
+  color: white;
+  border: 1px solid #0e2d32;
+  border-radius: 3rem;
+  text-transform: uppercase;
+
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 500;
   font-size: 14px;
   line-height: 16px;
-  
+
   display: flex;
   align-items: center;
   text-align: center;
   letter-spacing: 0.2em;
-  }
-  
-  .row-artist{
-    border-top: 1px solid #D1CDC7;
-    margin-left: 2rem;
-    margin-right: 2rem;
-  }
-  
-  
-  .solution-name{
-    font-family: 'Barlow';
+}
+
+.row-artist {
+  border-top: 1px solid #d1cdc7;
+  margin-left: 2rem;
+  margin-right: 2rem;
+}
+
+.solution-name {
+  font-family: "Barlow";
   font-style: normal;
   font-weight: 300;
   font-size: 1.5rem;
   line-height: 1.5rem;
-  color: #0E2D32;
-  
-  
-  }
-  
-  .row-artist{
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-  }
-  .solution-title{
-    font-family: "Barlow";
-    font-style: normal;
-    font-weight: 500;
-    font-size: 1.5rem;
-    line-height: 1.5rem;
-    color: #000000;
-    margin-top: 2rem;
-    margin-bottom: 2rem;
-    text-align: center;
-  
-  }
-  
-  .logo{
-    width: 10rem;
-    height: 10rem;
-    margin-left: 2rem;
-    margin-right: 2rem;
-  }
-  </style>
+  color: #0e2d32;
+}
+
+.row-artist {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+.solution-title {
+  font-family: "Barlow";
+  font-style: normal;
+  font-weight: 500;
+  font-size: 1.5rem;
+  line-height: 1.5rem;
+  color: #000000;
+  margin-top: 2rem;
+  margin-bottom: 2rem;
+  text-align: center;
+}
+
+.logo {
+  width: 10rem;
+  height: 10rem;
+  margin-left: 2rem;
+  margin-right: 2rem;
+}
+</style>

+ 44 - 0
eslintrc.js

@@ -0,0 +1,44 @@
+module.exports = {
+  extends: [
+    'eslint:recommended',
+    'plugin:vue/recommended' 
+  ],
+  plugins: [
+    'vue' 
+  ],
+  rules: {
+    // Règles générales
+    'no-console': 'off', // Autoriser l'utilisation de console.log() (peut être personnalisé selon vos besoins)
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off', // Interdire l'utilisation de debugger dans les environnements de production
+    'no-unused-vars': 'warn', // Avertir en cas de variables non utilisées
+
+    // Règles spécifiques à Vue.js
+    'vue/attribute-hyphenation': 'error', // Utiliser la notation kebab-case pour les attributs dans les templates
+    'vue/component-definition-name-casing': ['error', 'PascalCase'], // Utiliser PascalCase pour les noms de composants Vue
+    'vue/html-closing-bracket-newline': ['error', {
+      'singleline': 'never', // Pas de nouvelle ligne après une balise de fermeture en ligne
+      'multiline': 'always' // Nouvelle ligne après une balise de fermeture multiligne
+    }],
+    'vue/html-closing-bracket-spacing': ['error', {
+      'startTag': 'never', // Pas d'espace avant la balise de fermeture
+      'endTag': 'never', // Pas d'espace avant la balise de fermeture
+      'selfClosingTag': 'always' // Espace avant la balise de fermeture des balises auto-fermantes
+    }],
+    'vue/html-indent': ['error', 2, {
+      'attribute': 1, // Indentation des attributs
+      'baseIndent': 1, // Indentation de base du contenu
+      'closeBracket': 0, // Pas d'indentation pour les balises de fermeture
+      'alignAttributesVertically': true // Aligner les attributs verticalement
+    }],
+    'vue/max-attributes-per-line': ['error', {
+      'singleline': 3, // Maximum de 3 attributs par ligne en ligne unique
+      'multiline': {
+        'max': 1, // Maximum de 1 attribut par ligne en mode multiligne
+        'allowFirstLine': false // Interdire les attributs sur la première ligne en mode multiligne
+      }
+    }],
+    'vue/no-v-html': 'off', // Autoriser l'utilisation de v-html
+    'vue/require-default-prop': 'off', // Ne pas exiger de valeur par défaut pour les props
+    'vue/singleline-html-element-content-newline': 'off', // Autoriser le contenu en ligne dans les éléments HTML
+  }
+};

+ 1 - 2
lang/fr.json

@@ -1,2 +1 @@
-{
-}
+{}

+ 5 - 2
nuxt.config.ts

@@ -34,7 +34,10 @@ export default defineNuxtConfig({
       ],
       link: [
         { rel: "icon", type: "image/x-icon", href: "/favicon.ico" },
-        { rel: 'stylesheet', href: 'https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;700&display=swap' }
+        {
+          rel: "stylesheet",
+          href: "https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;700&display=swap",
+        },
       ],
     },
   },
@@ -74,7 +77,7 @@ export default defineNuxtConfig({
   ],
   webfontloader: {
     google: {
-      families: ['Barlow:300,400,500,700&display=swap'],
+      families: ["Barlow:300,400,500,700&display=swap"],
     },
   },
   devtools: {

+ 4 - 4
package.json

@@ -4,7 +4,7 @@
   "private": true,
   "scripts": {
     "dev": "nuxt dev",
-    "generate" : "nuxt generate",
+    "generate": "nuxt generate",
     "dev:local": "yarn dev --dotenv .env.local",
     "dev:prod": "yarn dev --dotenv .env.prod",
     "dev:ci": "yarn dev --dotenv .env.ci",
@@ -71,13 +71,13 @@
     "@vue/eslint-config-standard": "^8.0.1",
     "@vue/test-utils": "^2.2.10",
     "cypress": "8.7.0",
-    "eslint": "^8.34.0",
+    "eslint": "^8.43.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-nuxt": "^4.0.0",
     "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-vue": "^9.7.0",
+    "eslint-plugin-vue": "^9.15.1",
     "jsdom": "^21.0.0",
-    "prettier": "^2.8.4",
+    "prettier": "2.8.8",
     "sass-loader": "^13.2.1",
     "ts-jest": "^29.0.3",
     "typescript": "4.9.5",

+ 5 - 7
pages/about.vue

@@ -1,15 +1,13 @@
 <template>
-  <LayoutNavigation/>
-  <AboutBanner/>
+  <LayoutNavigation />
+  <AboutBanner />
   <AboutHistoire />
   <AboutValeurs />
   <AboutLogiciels />
   <AboutAgenda />
-  <LayoutFooter/>
+  <LayoutFooter />
 </template>
 
-<script setup>
-</script>
+<script setup></script>
 
-<style scoped>
-</style>
+<style scoped></style>

+ 3 - 5
pages/formation.vue

@@ -1,5 +1,5 @@
 <template>
-  <LayoutNavigation/>
+  <LayoutNavigation />
   <FormationBanner />
   <FormationProgramme />
   <FormationCatalogue />
@@ -12,8 +12,6 @@
   <LayoutFooter />
 </template>
 
-<script setup>
-</script>
+<script setup></script>
 
-<style scoped>
-</style>
+<style scoped></style>

+ 8 - 8
pages/index.vue

@@ -1,13 +1,13 @@
 <template>
   <LayoutNavigation />
-  <HomeCaroussel/>
-  <HomePromotion/>
-  <HomeSolution/>
-  <HomeEventAgenda/>
-  <HomeReviews/>
-  <HomeNews/>
-  <HomeHelp/>
-  <LayoutFooter/>
+  <HomeCaroussel />
+  <HomePromotion />
+  <HomeSolution />
+  <HomeEventAgenda />
+  <HomeReviews />
+  <HomeNews />
+  <HomeHelp />
+  <LayoutFooter />
 </template>
 
 <script></script>

+ 2 - 4
pages/join.vue

@@ -5,8 +5,6 @@
   <LayoutFooter />
 </template>
 
-<script setup>
-</script>
+<script setup></script>
 
-<style scoped>
-</style>
+<style scoped></style>

+ 6 - 6
pages/logiciels/artist.vue

@@ -1,16 +1,16 @@
 <template>
-  <LayoutNavigation /> 
+  <LayoutNavigation />
   <LogicielsArtistBanner />
   <LogicielsArtistMenuScroll />
   <LogicielsArtistOutil />
   <LogicielsArtistAvantages />
   <LogicielsArtistFonctionnalites />
   <LogicielsArtistPremium />
-  <LogicielsArtistProjet/>
-  <LogicielsArtistAccompagnement/>
-  <LogicielsArtistReviews/>
-  <LayoutFAQ/>
-  <LogicielsArtistSolutions/>
+  <LogicielsArtistProjet />
+  <LogicielsArtistAccompagnement />
+  <LogicielsArtistReviews />
+  <LayoutFAQ />
+  <LogicielsArtistSolutions />
   <LayoutFooter />
 </template>
 

+ 5 - 5
pages/logiciels/manager.vue

@@ -1,15 +1,15 @@
 <template>
-  <LayoutNavigation /> 
+  <LayoutNavigation />
   <LogicielsManagerBanner />
   <LogicielsManagerMenuScroll />
   <LogicielsManagerOutil />
   <LogicielsManagerAvantages />
   <LogicielsManagerFonctionnalites />
   <LogicielsManagerPyramide />
-  <LogicielsManagerAccompagnement/>
-  <LogicielsManagerReviews/>
-  <LayoutFAQ/>
-  <LogicielsManagerSolutions/>
+  <LogicielsManagerAccompagnement />
+  <LogicielsManagerReviews />
+  <LayoutFAQ />
+  <LogicielsManagerSolutions />
   <LayoutFooter />
 </template>
 

+ 7 - 7
pages/logiciels/school.vue

@@ -1,17 +1,17 @@
 <template>
-  <LayoutNavigation /> 
+  <LayoutNavigation />
   <LogicielsSchoolBanner />
   <LogicielsSchoolMenuScroll />
   <LogicielsSchoolOutil />
   <LogicielsSchoolAvantages />
   <LogicielsSchoolFonctionnalites />
   <LogicielsSchoolPremium />
-  <LogicielsSchoolProjet/>
-  <LogicielsSchoolAccompagnement/>
-  <LogicielsSchoolReviews/>
-  <LogicielsSchoolAgenda/>
-  <LayoutFAQ/>
-  <LogicielsSchoolSolutions/>
+  <LogicielsSchoolProjet />
+  <LogicielsSchoolAccompagnement />
+  <LogicielsSchoolReviews />
+  <LogicielsSchoolAgenda />
+  <LayoutFAQ />
+  <LogicielsSchoolSolutions />
   <LayoutFooter />
 </template>
 

+ 14 - 15
plugins/vuetify.ts

@@ -1,31 +1,30 @@
-import { createVuetify } from 'vuetify'
-import 'vuetify/styles'
-import { aliases, fa } from 'vuetify/iconsets/fa'
-import '@fortawesome/fontawesome-free/css/all.css'
-import {fr} from 'vuetify/locale'
-import { defineNuxtPlugin } from '#app'
+import { createVuetify } from "vuetify";
+import "vuetify/styles";
+import { aliases, fa } from "vuetify/iconsets/fa";
+import "@fortawesome/fontawesome-free/css/all.css";
+import { fr } from "vuetify/locale";
+import { defineNuxtPlugin } from "#app";
 
-export default defineNuxtPlugin(nuxtApp => {
+export default defineNuxtPlugin((nuxtApp) => {
   const vuetify = createVuetify({
     ssr: true,
     locale: {
-      locale: 'fr',
+      locale: "fr",
       messages: { fr },
     },
     theme: {
-      defaultTheme: 'light',
+      defaultTheme: "light",
       themes: {
-        light: {
-        },
+        light: {},
       },
     },
     icons: {
-      defaultSet: 'fa',
+      defaultSet: "fa",
       aliases,
       sets: {
         fa,
       },
     },
-  })
-  nuxtApp.vueApp.use(vuetify)
-})
+  });
+  nuxtApp.vueApp.use(vuetify);
+});

+ 3 - 8
tsconfig.json

@@ -12,12 +12,7 @@
       "@nuxtjs/i18n",
       "vitest/globals"
     ],
-    "exclude": [
-      "node_modules",
-      ".nuxt"
-    ],
-    "typeRoots": [
-      "./types"
-    ]
+    "exclude": ["node_modules", ".nuxt"],
+    "typeRoots": ["./types"]
   }
-}
+}

+ 96 - 37
yarn.lock

@@ -870,14 +870,26 @@
   resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.17.11.tgz#9be796d93ae27b636da32d960899a4912bca27a1"
   integrity sha512-N9vXqLP3eRL8BqSy8yn4Y98cZI2pZ8fyuHx6lKjiG2WABpT2l01TXdzq5Ma2ZUBzfB7tx5dXVhge8X9u0S70ZQ==
 
-"@eslint/eslintrc@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-2.0.0.tgz#943309d8697c52fc82c076e90c1c74fbbe69dbff"
-  integrity sha512-fluIaaV+GyV24CCu/ggiHdV+j4RNh85yQnAYS/G2mZODZgGmmlrgCydjUcV3YvxCm9x8nMAfThsqTni4KiXT4A==
+"@eslint-community/eslint-utils@^4.2.0", "@eslint-community/eslint-utils@^4.3.0":
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz#a23514e8fb9af1269d5f7788aa556798d61c6b59"
+  integrity sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==
+  dependencies:
+    eslint-visitor-keys "^3.3.0"
+
+"@eslint-community/regexpp@^4.4.0":
+  version "4.5.1"
+  resolved "https://registry.yarnpkg.com/@eslint-community/regexpp/-/regexpp-4.5.1.tgz#cdd35dce4fa1a89a4fd42b1599eb35b3af408884"
+  integrity sha512-Z5ba73P98O1KUYCCJTUeVpja9RcGoMdncZ6T49FCUl2lN38JtCJ+3WgIDBv0AuY4WChU5PmtJmOCTlN6FZTFKQ==
+
+"@eslint/eslintrc@^2.0.3":
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-2.0.3.tgz#4910db5505f4d503f27774bf356e3704818a0331"
+  integrity sha512-+5gy6OQfk+xx3q0d6jGZZC3f3KzAkXc/IanVxd1is/VIIziRqqt3ongQz0FiTUXqTk0c7aDB3OaFuKnuSoJicQ==
   dependencies:
     ajv "^6.12.4"
     debug "^4.3.2"
-    espree "^9.4.0"
+    espree "^9.5.2"
     globals "^13.19.0"
     ignore "^5.2.0"
     import-fresh "^3.2.1"
@@ -885,10 +897,10 @@
     minimatch "^3.1.2"
     strip-json-comments "^3.1.1"
 
-"@eslint/js@8.35.0":
-  version "8.35.0"
-  resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.35.0.tgz#b7569632b0b788a0ca0e438235154e45d42813a7"
-  integrity sha512-JXdzbRiWclLVoD8sNUjR443VVlYqiYmDVT6rGUEIEHU5YJW0gaVZwV2xgM7D4arkvASqD0IlLUVjHiFuxaftRw==
+"@eslint/js@8.43.0":
+  version "8.43.0"
+  resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.43.0.tgz#559ca3d9ddbd6bf907ad524320a0d14b85586af0"
+  integrity sha512-s2UHCoiXfxMvmfzqoN+vrQ84ahUSYde9qNO1MdxmoEhyHWsfmwOpFlwYV+ePJEVc7gFnATGUi376WowX1N7tFg==
 
 "@fortawesome/fontawesome-common-types@6.4.0":
   version "6.4.0"
@@ -943,10 +955,10 @@
   resolved "https://registry.yarnpkg.com/@gar/promisify/-/promisify-1.1.3.tgz#555193ab2e3bb3b6adc3d551c9c030d9e860daf6"
   integrity sha512-k2Ty1JcVojjJFwrg/ThKi2ujJ7XNLYaFGNB/bWT9wGR+oSMJHMa5w+CUq6p/pVrKeNNgA7pCqEcjSnHVoqJQFw==
 
-"@humanwhocodes/config-array@^0.11.8":
-  version "0.11.8"
-  resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.11.8.tgz#03595ac2075a4dc0f191cc2131de14fbd7d410b9"
-  integrity sha512-UybHIJzJnR5Qc/MsD9Kr+RpO2h+/P1GhOwdiLPXK5TWk5sgTdu88bTD9UP+CKbPPh5Rni1u0GjAdYQLemG8g+g==
+"@humanwhocodes/config-array@^0.11.10":
+  version "0.11.10"
+  resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.11.10.tgz#5a3ffe32cc9306365fb3fd572596cd602d5e12d2"
+  integrity sha512-KVVjQmNUepDVGXNuoRRdmmEjruj0KfiGSbS8LVc12LMsWDQzRXJ0qdhN8L8uUigKpfEHRhlaQFY0ib1tnUbNeQ==
   dependencies:
     "@humanwhocodes/object-schema" "^1.2.1"
     debug "^4.1.1"
@@ -5426,6 +5438,19 @@ eslint-plugin-unicorn@^44.0.2:
     semver "^7.3.7"
     strip-indent "^3.0.0"
 
+eslint-plugin-vue@^9.15.1:
+  version "9.15.1"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-9.15.1.tgz#3c09e0edab444b5d4d9239a12a645a0e2e2ea5be"
+  integrity sha512-CJE/oZOslvmAR9hf8SClTdQ9JLweghT6JCBQNrT2Iel1uVw0W0OLJxzvPd6CxmABKCvLrtyDnqGV37O7KQv6+A==
+  dependencies:
+    "@eslint-community/eslint-utils" "^4.3.0"
+    natural-compare "^1.4.0"
+    nth-check "^2.0.1"
+    postcss-selector-parser "^6.0.9"
+    semver "^7.3.5"
+    vue-eslint-parser "^9.3.0"
+    xml-name-validator "^4.0.0"
+
 eslint-plugin-vue@^9.4.0, eslint-plugin-vue@^9.7.0:
   version "9.9.0"
   resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-9.9.0.tgz#ac788ebccd2eb94d846a507df55da50693b80c91"
@@ -5455,6 +5480,14 @@ eslint-scope@^7.1.1:
     esrecurse "^4.3.0"
     estraverse "^5.2.0"
 
+eslint-scope@^7.2.0:
+  version "7.2.0"
+  resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-7.2.0.tgz#f21ebdafda02352f103634b96dd47d9f81ca117b"
+  integrity sha512-DYj5deGlHBfMt15J7rdtyKNq/Nqlv5KfU4iodrQ019XESsRnwXH9KAE0y3cwtUHDo2ob7CypAnCqefh6vioWRw==
+  dependencies:
+    esrecurse "^4.3.0"
+    estraverse "^5.2.0"
+
 eslint-utils@^2.0.0, eslint-utils@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-2.1.0.tgz#d2de5e03424e707dc10c74068ddedae708741b27"
@@ -5484,6 +5517,11 @@ eslint-visitor-keys@^3.3.0:
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.3.0.tgz#f6480fa6b1f30efe2d1968aa8ac745b862469826"
   integrity sha512-mQ+suqKJVyeuwGYHAdjMFqjCyfl8+Ldnxuyp3ldiMBFKkvytrXUZWaiPCEav8qDHKty44bD+qV1IP4T+w+xXRA==
 
+eslint-visitor-keys@^3.4.1:
+  version "3.4.1"
+  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.1.tgz#c22c48f48942d08ca824cc526211ae400478a994"
+  integrity sha512-pZnmmLwYzf+kWaM/Qgrvpen51upAktaaiI01nsJD/Yr3lMOdNtq0cxkrrg16w64VtisN6okbs7Q8AfGqj4c9fA==
+
 eslint-webpack-plugin@^2.6.0:
   version "2.7.0"
   resolved "https://registry.yarnpkg.com/eslint-webpack-plugin/-/eslint-webpack-plugin-2.7.0.tgz#0525793a4f8c652c1c6d863995ce1e0f2dcbd143"
@@ -5496,14 +5534,16 @@ eslint-webpack-plugin@^2.6.0:
     normalize-path "^3.0.0"
     schema-utils "^3.1.1"
 
-eslint@^8.34.0:
-  version "8.35.0"
-  resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.35.0.tgz#fffad7c7e326bae606f0e8f436a6158566d42323"
-  integrity sha512-BxAf1fVL7w+JLRQhWl2pzGeSiGqbWumV4WNvc9Rhp6tiCtm4oHnyPBSEtMGZwrQgudFQ+otqzWoPB7x+hxoWsw==
+eslint@^8.43.0:
+  version "8.43.0"
+  resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.43.0.tgz#3e8c6066a57097adfd9d390b8fc93075f257a094"
+  integrity sha512-aaCpf2JqqKesMFGgmRPessmVKjcGXqdlAYLLC3THM8t5nBRZRQ+st5WM/hoJXkdioEXLLbXgclUpM0TXo5HX5Q==
   dependencies:
-    "@eslint/eslintrc" "^2.0.0"
-    "@eslint/js" "8.35.0"
-    "@humanwhocodes/config-array" "^0.11.8"
+    "@eslint-community/eslint-utils" "^4.2.0"
+    "@eslint-community/regexpp" "^4.4.0"
+    "@eslint/eslintrc" "^2.0.3"
+    "@eslint/js" "8.43.0"
+    "@humanwhocodes/config-array" "^0.11.10"
     "@humanwhocodes/module-importer" "^1.0.1"
     "@nodelib/fs.walk" "^1.2.8"
     ajv "^6.10.0"
@@ -5512,10 +5552,9 @@ eslint@^8.34.0:
     debug "^4.3.2"
     doctrine "^3.0.0"
     escape-string-regexp "^4.0.0"
-    eslint-scope "^7.1.1"
-    eslint-utils "^3.0.0"
-    eslint-visitor-keys "^3.3.0"
-    espree "^9.4.0"
+    eslint-scope "^7.2.0"
+    eslint-visitor-keys "^3.4.1"
+    espree "^9.5.2"
     esquery "^1.4.2"
     esutils "^2.0.2"
     fast-deep-equal "^3.1.3"
@@ -5523,13 +5562,12 @@ eslint@^8.34.0:
     find-up "^5.0.0"
     glob-parent "^6.0.2"
     globals "^13.19.0"
-    grapheme-splitter "^1.0.4"
+    graphemer "^1.4.0"
     ignore "^5.2.0"
     import-fresh "^3.0.0"
     imurmurhash "^0.1.4"
     is-glob "^4.0.0"
     is-path-inside "^3.0.3"
-    js-sdsl "^4.1.4"
     js-yaml "^4.1.0"
     json-stable-stringify-without-jsonify "^1.0.1"
     levn "^0.4.1"
@@ -5537,7 +5575,6 @@ eslint@^8.34.0:
     minimatch "^3.1.2"
     natural-compare "^1.4.0"
     optionator "^0.9.1"
-    regexpp "^3.2.0"
     strip-ansi "^6.0.1"
     strip-json-comments "^3.1.0"
     text-table "^0.2.0"
@@ -5558,7 +5595,7 @@ espree@^6.0.0:
     acorn-jsx "^5.2.0"
     eslint-visitor-keys "^1.1.0"
 
-espree@^9.3.1, espree@^9.4.0:
+espree@^9.3.1:
   version "9.4.1"
   resolved "https://registry.yarnpkg.com/espree/-/espree-9.4.1.tgz#51d6092615567a2c2cff7833445e37c28c0065bd"
   integrity sha512-XwctdmTO6SIvCzd9810yyNzIrOrqNYV9Koizx4C/mRhf9uq0o4yHoCEU/670pOxOL/MSraektvSAji79kX90Vg==
@@ -5567,6 +5604,15 @@ espree@^9.3.1, espree@^9.4.0:
     acorn-jsx "^5.3.2"
     eslint-visitor-keys "^3.3.0"
 
+espree@^9.5.2:
+  version "9.5.2"
+  resolved "https://registry.yarnpkg.com/espree/-/espree-9.5.2.tgz#e994e7dc33a082a7a82dceaf12883a829353215b"
+  integrity sha512-7OASN1Wma5fum5SrNhFMAMJxOUAbhyfQ8dQ//PJaJbNw0URTPWqIghHWt1MmAANKhHZIYOHruW4Kw4ruUWOdGw==
+  dependencies:
+    acorn "^8.8.0"
+    acorn-jsx "^5.3.2"
+    eslint-visitor-keys "^3.4.1"
+
 esprima@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71"
@@ -6320,6 +6366,11 @@ grapheme-splitter@^1.0.4:
   resolved "https://registry.yarnpkg.com/grapheme-splitter/-/grapheme-splitter-1.0.4.tgz#9cf3a665c6247479896834af35cf1dbb4400767e"
   integrity sha512-bzh50DW9kTPM00T8y4o8vQg89Di9oLJVLW/KaOGIXJWP/iqCN6WKYkbNOF04vFLJhwcpYUh9ydh/+5vpOqV4YQ==
 
+graphemer@^1.4.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/graphemer/-/graphemer-1.4.0.tgz#fb2f1d55e0e3a1849aeffc90c4fa0dd53a0e66c6"
+  integrity sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==
+
 gzip-size@^7.0.0:
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/gzip-size/-/gzip-size-7.0.0.tgz#9f9644251f15bc78460fccef4055ae5a5562ac60"
@@ -7074,11 +7125,6 @@ js-cookie@^3.0.1:
   resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-3.0.1.tgz#9e39b4c6c2f56563708d7d31f6f5f21873a92414"
   integrity sha512-+0rgsUXZu4ncpPxRL+lNEptWMOWl9etvPHc/koSRp6MPwpRYAhmk0dUG00J4bxVV3r9uUzfo24wW0knS07SKSw==
 
-js-sdsl@^4.1.4:
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/js-sdsl/-/js-sdsl-4.3.0.tgz#aeefe32a451f7af88425b11fdb5f58c90ae1d711"
-  integrity sha512-mifzlm2+5nZ+lEcLJMoBK0/IH/bDg8XnJfd/Wq6IP+xoCjLZsTOnV2QpxlVbX9bMnkl5PdEjNtBJ9Cj1NjifhQ==
-
 "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
@@ -8917,10 +8963,10 @@ prettier-linter-helpers@^1.0.0:
   dependencies:
     fast-diff "^1.1.2"
 
-prettier@^2.8.4:
-  version "2.8.4"
-  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.4.tgz#34dd2595629bfbb79d344ac4a91ff948694463c3"
-  integrity sha512-vIS4Rlc2FNh0BySk3Wkd6xmwxB0FpOndW5fisM5H8hsZSxU2VWVB5CWIkIjWvrHjIhxk2g3bfMKM87zNTrZddw==
+prettier@2.8.8:
+  version "2.8.8"
+  resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.8.tgz#e8c5d7e98a4305ffe3de2e1fc4aca1a71c28b1da"
+  integrity sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==
 
 pretty-bytes@^5.6.0:
   version "5.6.0"
@@ -10779,6 +10825,19 @@ vue-eslint-parser@^9.0.1, vue-eslint-parser@^9.0.3:
     lodash "^4.17.21"
     semver "^7.3.6"
 
+vue-eslint-parser@^9.3.0:
+  version "9.3.1"
+  resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-9.3.1.tgz#429955e041ae5371df5f9e37ebc29ba046496182"
+  integrity sha512-Clr85iD2XFZ3lJ52/ppmUDG/spxQu6+MAeHXjjyI4I1NUYZ9xmenQp4N0oaHJhrA8OOxltCVxMRfANGa70vU0g==
+  dependencies:
+    debug "^4.3.4"
+    eslint-scope "^7.1.1"
+    eslint-visitor-keys "^3.3.0"
+    espree "^9.3.1"
+    esquery "^1.4.0"
+    lodash "^4.17.21"
+    semver "^7.3.6"
+
 vue-i18n-routing@^0.12.2:
   version "0.12.2"
   resolved "https://registry.yarnpkg.com/vue-i18n-routing/-/vue-i18n-routing-0.12.2.tgz#f89d0bdc256e7e6032c36163d4b09a048082b3e9"