correction path

components/Home/Caroussel.vue

@@ -4,17 +4,6 @@
       title="LOGICIELS CULTURELS"
       subtitle="UNE GAMME DE LOGICIELS ADAPTÉE À CHAQUE STRUCTURE CULTURELLE"
     />
-    <!-- <v-carousel
-      ref="carousel"
-      v-model="activeIndex"
-      :show-arrows="false"
-      :class="smAndDown ? 'carousel-sm' : 'carousel'"
-      :hide-delimiter-background="true"
-      :show-delimiters="false"
-      :touch="true"
-      :cycle= true
-      :interval= 5000
-    > -->
     <v-carousel
       ref="carousel"
       v-model="activeIndex"

components/Home/EventAgenda.vue

@@ -11,7 +11,7 @@
       <div class="btn-container">
         <v-col cols="12" md="6" >
           <v-btn class="btn-event">
-            Découvrir les évènements
+            <span>Découvrir les évènements</span>
             <v-icon class="fa-solid fa-arrow-right icon-arrow" />
           </v-btn>
         </v-col>
@@ -51,8 +51,9 @@ const { lgAndUp, smAndDown } = useDisplay();
   line-height: 15px;
   width: 18rem;
   margin-top: 3rem;
-  padding: 2.4rem 4rem;
   min-width: 20rem;
+  max-width: 20rem;
+  height: 3.5rem;
 }
 .title {
   height: 9rem;

components/Layout/Navigation.vue

@@ -1,24 +1,21 @@
 <template>
-     <div class="container-grey">
-  <v-row>
-    <v-col cols="12" class="buttons-col">
-      <nuxt-link to="https://admin.opentalent.fr/#/login/">
-        <v-btn class="btn btn-common btn-login" text>
-          <v-icon left class="fas fa-user mr-4"></v-icon> Se connecter<br />aux
-          logiciels
-        </v-btn>
-      </nuxt-link>
-
-      <div class="vertical-bar" />
-      <v-btn class="btn btn-common btn-subscribe ml-4 mr-2" text>
-        <v-icon left class="fas fa-calendar mr-4"></v-icon> Logiciel Culturel
-      </v-btn>
-    </v-col>
-  </v-row>
-</div>
-  <LayoutContainer>
-
+  <div class="container-grey">
+    <v-row>
+      <v-col cols="12" class="buttons-col">
+        <nuxt-link to="https://admin.opentalent.fr/#/login/">
+          <v-btn class="btn btn-common btn-login" text>
+            <v-icon left class="fas fa-user mr-4"></v-icon> Se connecter<br />aux
+            logiciels
+          </v-btn>
+        </nuxt-link>
 
+        <div class="vertical-bar" />
+        <v-btn class="btn btn-common btn-subscribe ml-4 mr-2" text>
+          <v-icon left class="fas fa-calendar mr-4"></v-icon> Logiciel Culturel
+        </v-btn>
+      </v-col>
+    </v-row>
+  </div>
     <v-row class="menu">
       <v-col cols="3">
         <nuxt-link to="/">
@@ -91,7 +88,6 @@
         <nuxt-link class="link-style" to="/actualites">Actualités</nuxt-link>
       </v-col>
     </v-row>
-  </LayoutContainer>
 </template>
 
 <script setup>
@@ -203,6 +199,4 @@ const aboutLinks = ref([
 .logo {
   height: 8rem;
 }
-
-
 </style>

components/Layout/UI/ContainerVideo.vue

@@ -32,23 +32,30 @@ import { useRoute } from "vue-router";
 const route = useRoute();
 
 const currentCitation = computed(() => {
-  switch (route.path) {
-    case "/opentalent_school":
-      return "Pour les petits comme pour les grands établissements d’enseignement artistique.";
-    case "/opentalent_artist":
-      return "Le logiciel de gestion et communication au service de votre passion";
-    case "/opentalent_manager":
-      return "“ Une solution unique, collaborative et innovante pour une gestion optimale de votre réseau culturel.“.";
-    default:
-      return "Citation par défaut";
+  // Utilisation d'une expression régulière pour vérifier le chemin
+  if (/^\/opentalent_school\/?$/.test(route.path)) {
+    return "Pour les petits comme pour les grands établissements d’enseignement artistique.";
+  } else if (route.path === "/opentalent_artist") {
+    return "Le logiciel de gestion et communication au service de votre passion";
+  } else if (route.path === "/opentalent_manager") {
+    return "“ Une solution unique, collaborative et innovante pour une gestion optimale de votre réseau culturel.“.";
+  } else {
+    return "Citation par défaut";
   }
 });
 
 const iconColor = computed(() => {
-  if (route.path === "/opentalent_school") {
+  if (/^\/opentalent_school\/?$/.test(route.path)) {
     return "rgba(32, 147, 190, 0.6)";
-  } else if (route.path === "/opentalent_artist") return "#fac20a";
+  } else if (/^\/opentalent_artist\/?$/.test(route.path)) {
+    return "#fac20a";
+  } else if (/^\/opentalent_manager\/?$/.test(route.path)) {
+    return "rgb(216, 5, 11)";
+  } else {
+    return "rgba(32, 147, 190, 0.6)"; 
+  }
 });
+
 </script>
 
 <style scoped>

components/Logiciels/School/Formations.vue

@@ -14,7 +14,10 @@
           <v-col cols="6" v-for="(formation, index) in formations" :key="index">
             <div class="image-wrapper mb-6">
               <div :class="formation.overlayClass"></div>
-              <div :style="{ backgroundImage: 'url(' + formation.image + ')' }" class="background-img"></div>
+              <div
+                :style="{ backgroundImage: 'url(' + formation.image + ')' }"
+                class="background-img"
+              ></div>
             </div>
             <div class="col-details">
               <h4 class="session-title">
@@ -33,52 +36,53 @@
 
       <v-row>
         <v-col cols="4">
-          <v-row>
+          <v-container> </v-container>
+          <v-row no-gutters>
             <LayoutUISubTitle
               :iconSize="6"
               :iconClasses="iconClasses"
               :titleText="' Pour les petits comme pour les GRANDS établissements d\'enseignement artistique '"
             />
           </v-row>
-          
         </v-col>
       </v-row>
 
-      <v-row class="card-container mb-12">
-        <v-col
-          cols="3"
-          class="d-flex justify-center align-center small-padding"
-        >
-          <LayoutCardStat
-            :chiffre="'30 > 1500'"
-            text="élèves"
-            backgroundColor="#c3e5e7"
-          />
-        </v-col>
-        <v-col cols="3" class="d-flex justify-center align-center">
-          <LayoutCardStat
-            :chiffre="234"
-            text="Clients"
-            backgroundColor="#c3e5e7"
-          />
-        </v-col>
-        <v-col cols="3" class="d-flex justify-center align-center">
-          <LayoutCardStat
-            :chiffre="20304"
-            text="Utilisateurs"
-            backgroundColor="#c3e5e7"
-          />
-        </v-col>
-        <v-col cols="3" class="d-flex justify-center align-center">
-          <LayoutCardStat
-            :chiffre="13"
-            text="années d'expérience"
-            backgroundColor="#c3e5e7"
-          />
-        </v-col>
-      </v-row>
-
-
+      <v-container>
+        <v-row class="mb-12">
+          <v-col
+            cols="12"
+            lg="3"
+            class="d-flex justify-center align-center small-padding"
+          >
+            <LayoutCardStat
+              :chiffre="'30 > 1500'"
+              text="élèves"
+              backgroundColor="#c3e5e7"
+            />
+          </v-col>
+          <v-col cols="12" lg="3" class="d-flex justify-center align-center">
+            <LayoutCardStat
+              :chiffre="234"
+              text="Clients"
+              backgroundColor="#c3e5e7"
+            />
+          </v-col>
+          <v-col cols="12" lg="3" class="d-flex justify-center align-center">
+            <LayoutCardStat
+              :chiffre="20304"
+              text="Utilisateurs"
+              backgroundColor="#c3e5e7"
+            />
+          </v-col>
+          <v-col cols="12" lg="3" class="d-flex justify-center align-center">
+            <LayoutCardStat
+              :chiffre="13"
+              text="années d'expérience"
+              backgroundColor="#c3e5e7"
+            />
+          </v-col>
+        </v-row>
+      </v-container>
       <v-row />
       <LayoutCarouselTrustCompanie :items="items" />
     </LayoutContainer>
@@ -117,17 +121,17 @@ const items = ref([
   { src: "/images/reviews/school/review4.jpeg" },
   { src: "/images/reviews/school/review5.jpeg" },
   { src: "/images/reviews/school/review6.jpeg" },
-
 ]);
 </script>
 
 <style scoped>
-.image-wrapper {
-  position: relative;
+.v-row {
+  max-width: 1600px;
+  margin: 0 auto;
 }
+
 .background-img {
   width: 600px;
-  margin-left: 5rem;
   height: 400px;
   background-size: cover;
   background-position: center;
@@ -135,7 +139,6 @@ const items = ref([
 
 .col-details {
   margin-right: 6rem;
-  margin-left: 5rem;
 }
 
 .formation-btn {

components/Logiciels/School/Reviews.vue

@@ -57,6 +57,8 @@
 import { ref } from "vue";
 import { Carousel, Slide } from "vue3-carousel";
 import "vue3-carousel/dist/carousel.css";
+import { useDisplay } from "vuetify";
+const { smAndDown, mdAndDown, lgAndUp } = useDisplay();
 
 const carousel = ref(null);
 

pages/test.vue

@@ -1,150 +1,74 @@
 <template>
-  <div id="Nos logiciels">
-    <LayoutContainer>
-      <v-row class="mb-6">
-        <LayoutUISubTitle titleText="Ce qui nous anime" />
-        <LayoutUITitle title="Nos logiciels dédiés à chaque acteur culturel" />
-      </v-row>
+  <v-app>
+      <v-app-bar-nav-icon  @click="drawer = true">
+    </v-app-bar-nav-icon>
 
-      <v-row no-gutters="">
-        <v-col cols="3">
-          Découvrez notre gamme de logiciels de gestion & de communication
-          adapté au secteur culturel. Des fonctionnalités complètes:
-          <ul class="custom-list-style">
-            <li v-for="(feature, index) in features" :key="index">{{ feature }}</li>
-          </ul>
-        </v-col>
-        <v-col cols="3" v-for="(item, index) in items" :key="index">
-          <div
-            class="container-image"
-            :style="{ backgroundImage: 'url(' + item.imageUrl + ')' }"
-          >
-            <div class="overlay"></div>
-            <div class="footer-container">
-              <v-img class="logo" :src="item.logoUrl"></v-img>
-              <nuxt-link :to="item.link">
-                <v-btn
-                  :style="{ backgroundColor: item.buttonColor }"
-                  class="plus-button"
-                >
-                  <v-icon>fas fa-plus</v-icon>
-                </v-btn>
-              </nuxt-link>
-            </div>
-          </div>
-        </v-col>
-      </v-row>
-    </LayoutContainer>
-  </div>
-</template>
 
-<script setup>
-const features = [
-  "Une gestion de vos contacts",
-  "un agenda collaboratif et interactif",
-  "Une gestion du matériel et du stock",
-  "Une communication simplifiée",
-  "Un rapport d'activité complet",
-  "Un site internet intégré",
-  "Et bien plus encore..."
-];
+    <v-navigation-drawer v-model="drawer" app>
+      <v-list nav dense>
+        <v-list-item v-for="(item, index) in items" :key="item">
+          <v-list-item-title @click="selectMenu(item)">
+            {{ item }}
+          </v-list-item-title>
+        </v-list-item>
+      </v-list>
+    </v-navigation-drawer>
 
-const items = [
-  {
-    imageUrl: "/images/solutions/artist.jpg",
-    logoUrl: "/images/logo/logiciels/Artist-Blanc.png",
-    buttonColor: "#FAC20A",
-    link: "/opentalent_artist",
-  },
-  {
-    imageUrl: "/images/solutions/school.jpg",
-    logoUrl: "/images/logo/logiciels/School-Blanc.png",
-    buttonColor: "rgba(32, 147, 190)",
-    link: "/opentalent_school",
-  },
+    <!-- Tiroir de navigation pour les sous-menus -->
+    <v-navigation-drawer v-model="subMenuDrawer" app right temporary>
+      <v-list nav dense>
+        <!-- Bouton de retour -->
+        <v-list-item @click="closeSubMenu">
+          <v-list-item-title>Retour</v-list-item-title>
+        </v-list-item>
+
+        <!-- Éléments du sous-menu -->
+        <v-list-item
+          v-for="(subItem, subIndex) in subMenus[currentMenu]"
+          :key="subIndex"
+        >
+          <v-list-item-title>{{ subItem }}</v-list-item-title>
+        </v-list-item>
+      </v-list>
+    </v-navigation-drawer>
 
-  {
-    imageUrl: "/images/solutions/manager.png",
-    logoUrl: "/images/logo/logiciels/Artist-Blanc.png",
-    buttonColor: "#D8050B",
-    link: "/opentalent_manager",
+    <!-- Contenu principal -->
+  </v-app>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      drawer: false,
+      subMenuDrawer: false, // État du tiroir de navigation des sous-menus
+      currentMenu: "",
+      items: ["web", "shopping", "videos", "images", "news"],
+      subMenus: {
+        web: ["Sous-menu Web 1", "Sous-menu Web 2"],
+        shopping: ["Sous-menu Shopping 1", "Sous-menu Shopping 2"],
+        // Ajoutez d'autres sous-menus ici
+      },
+    };
   },
-];
+  methods: {
+    selectMenu(item) {
+      this.currentMenu = item;
+      this.subMenuDrawer = true; // Ouvre le tiroir de navigation des sous-menus
+    },
+    closeSubMenu() {
+      this.subMenuDrawer = false;
+      this.drawer = true; // Réouvre le menu principal
+    },
+  },
+};
 </script>
 
 <style scoped>
-.container {
-  max-width: 1700px;
-}
-.container-image {
-  position: relative;
-  background-image: url("/images/solutions/school.jpg");
-  background-repeat: no-repeat;
-  background-size: cover;
-  background-position: center;
-  width: 300px;
-  height: 400px;
-  z-index: 0;
-}
-
-.overlay {
+.nav-menu {
   position: absolute;
   top: 0;
-  left: 0;
   right: 0;
-  bottom: 0;
-  background-color: rgba(0, 0, 0, 0.5);
-  z-index: 1;
+  z-index: 999;
 }
-
-.footer-container {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  right: 0;
-}
-
-.logo {
-  width: 100px;
-  z-index: 2;
-  margin-right: 10px;
-}
-
-.plus-button {
-  background-color: #fac20a;
-  height: 70px;
-  z-index: 3;
-  border-bottom-right-radius: none !important;
-}
-
-.v-btn {
-  height: 80px !important;
-  border-bottom-right-radius: none !important;
-}
-
-.plus-button .v-icon {
-  color: #ffffff;
-  font-size: 2rem;
-}
-
-.plus-button,
-.v-btn {
-  border-radius: 0 !important;
-  box-shadow: none !important;
-  border-top-left-radius: 10% !important;
-}
-
-ul.custom-list-style {
-  list-style-type: none;
-  padding-left: 0; 
-}
-
-ul.custom-list-style li:before {
-  content: '- '; 
-  padding-right: 5px; 
-}
-
 </style>