various fixes

components/Common/Presentation.vue

@@ -196,7 +196,7 @@ const props = defineProps({
     font-size: 2.5rem;
     font-weight: bold;
     line-height: 2rem;
-    margin-left: 1rem;
+    margin-left: 0.8rem;
   }
 
   .smaller-text {
@@ -220,9 +220,11 @@ const props = defineProps({
 .picto-container {
   display: flex;
   flex-direction: row;
-  flex-wrap: wrap;
+  flex-wrap: nowrap;
 
-  @media (max-width: 600px) {
+  @media (max-width: 1240px) {
+    flex-wrap: wrap;
+    justify-content: center;
   }
 }
 

components/Formation/Catalogue.vue

@@ -48,11 +48,9 @@
                 </ul>
               </div>
 
-              <v-chip class="badge-time">
-                <span>
-                  Durée : {{ course.duration }}
-                </span>
-              </v-chip>
+              <div class="badge-time">
+                Durée : {{ course.duration }}
+              </div>
 
               <div class="program">
                 <h6 class="title-obj">
@@ -77,11 +75,9 @@
                 </v-row>
               </div>
 
-              <v-chip class="badge-time">
-                <span>
-                  {{ course.price }}
-                </span>
-              </v-chip>
+              <div class="badge-time">
+                {{ course.price }}
+              </div>
 
               <v-chip
                 class="chip-register"
@@ -271,21 +267,11 @@ const courses: Array<Training> = [
   }
 
   .badge-time {
-    color: var(--on-primary-color);
-    border: 1px solid var(--primary-color);
-    border-radius: 3rem;
+    color: var(--primary-color);
+    width: 100%;
+    text-align: center;
+    font-size: 18px;
     font-weight: 500;
-    font-size: 14px;
-    line-height: 18px;
-    margin-top: 1rem;
-    margin-bottom: 1rem;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-
-    span {
-      color: var(--primary-color);
-    }
   }
 
   .chip-register {

components/Home/EventAgenda.vue

@@ -83,11 +83,14 @@ h3 {
 }
 
 .btn-container {
-  display: flex;
-  align-items: center;
-  justify-content: center;
   padding: 0 20rem;
 
+  .v-col-12 {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
   @media (max-width: 1240px) {
     padding: 0 5rem;
     margin-top: 48px;

components/Home/Promotion.vue

@@ -180,6 +180,12 @@ const { mdAndUp } = useDisplay()
 }
 
 .v-row.demo {
+  max-height: 350px;
+
+  @media (max-width: 1280px) {
+    max-height: 1000px;
+  }
+
   .screen {
     width: 900px;
     object-fit: cover;

components/Home/Solution.vue

@@ -315,6 +315,7 @@ h4 {
     display: flex;
     justify-content: center;
     align-items: center;
+    max-width: 80%;
 
     ul {
       margin-top: 0.9rem;

components/Webinaire/Catalogue.vue

@@ -59,6 +59,10 @@
                 </ul>
               </div>
 
+              <div class="badge-time">
+                Durée : {{ course.duration }}
+              </div>
+
               <div class="program">
                 <h6>
                   Programme
@@ -82,17 +86,9 @@
                 </v-row>
               </div>
 
-              <v-chip class="badge-time">
-                <span>
-                  Durée : {{ course.duration }}
-                </span>
-              </v-chip>
-
-              <v-chip class="badge-time">
-                <span>
-                  {{ course.price }}
-                </span>
-              </v-chip>
+              <div class="badge-time">
+                {{ course.price }}
+              </div>
 
               <v-chip
                 class="chip-register"
@@ -391,12 +387,11 @@ const closeModal = () => {
   }
 
   .badge-time {
-    color: var(--neutral-color);
-    border: 1px solid var(--primary-color);
-  }
-
-  .badge-time span {
     color: var(--primary-color);
+    width: 100%;
+    text-align: center;
+    font-size: 18px;
+    font-weight: 500;
   }
 }