Selaa lähdekoodia

manager page is responsive for sm screens

Olivier Massot 1 vuosi sitten
vanhempi
commit
27d5e69ce5

+ 1 - 0
components/Layout/FAQ.vue

@@ -125,6 +125,7 @@ h3 {
   justify-content: center;
   display: flex;
   flex-direction: column;
+  align-items: center;
 
   @media (max-width: 1240px) {
     flex-direction: row;

+ 2 - 2
components/Layout/Footer/Solutions.vue

@@ -78,13 +78,13 @@
         v-if="showSchool"
         class="row-school"
       >
-        <v-col cols="2">
+        <v-col cols="6" md="2">
           <NuxtLink to="/opentalent_school">
             <v-img src="/images/logo/logiciels/School-noir.png" class="logo" />
           </NuxtLink>
         </v-col>
 
-        <v-col cols="10">
+        <v-col cols="6" md="10">
           <!-- list v-chip-->
           <v-chip-group column disabled>
             <v-chip class="ma-2 chip-custom" label>

+ 12 - 2
components/Layout/Navigation/Md.vue

@@ -8,7 +8,10 @@
         />
 
         <nuxt-link to="/">
-          <v-img class="logo-md" src="/images/logo/navigation-logo.png" />
+          <v-img
+            class="logo-md"
+            :src="smAndUp ? '/images/logo/navigation-logo.png' : '/images/Opentalent_Griffe.png'"
+          />
         </nuxt-link>
 
         <v-spacer />
@@ -78,6 +81,9 @@
 import AgendaLink from "~/components/Common/AgendaLink.vue";
 import type { PropType } from "@vue/runtime-core";
 import type { MainMenuItem } from "~/types/interface";
+import { useDisplay } from "vuetify";
+
+const { smAndUp } = useDisplay()
 
 const props = defineProps({
   menu: {
@@ -150,7 +156,11 @@ const withAnimation = (callback: () => void) => {
 
 .logo-md {
   width: 150px;
-  height: 300px;
+  height: 50px;
+
+  @media (max-width: 600px) {
+    width: 50px;
+  }
 }
 
 .back-item {

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

@@ -10,7 +10,7 @@
 
         <v-row class="formation pb-6 align-center">
           <v-col
-            cols="6"
+            md="6"
             v-for="(formation, index) in formations"
             :key="index"
           >

+ 2 - 1
components/Logiciels/Manager/Network.vue

@@ -1,7 +1,7 @@
 <template>
   <AnchoredSection id="network">
     <LayoutContainer>
-      <v-row class="mt-12  center-90">
+      <v-row class="mt-12 center-90">
         <LayoutUISubTitle>
           Un réseau pyramidal
         </LayoutUISubTitle>
@@ -45,5 +45,6 @@ import AnchoredSection from "~/components/Layout/AnchoredSection.vue";
   font-weight: 400;
   line-height: 2.375rem;
   width: 40rem;
+  max-width: 90%;
 }
 </style>

+ 3 - 3
components/Logiciels/Manager/SomeNumbers.vue

@@ -9,7 +9,7 @@
     <v-container>
       <v-row class="card-container justify-center mb-12">
         <v-col
-          cols="3"
+          md="3"
           class="d-flex justify-center align-center small-padding"
         >
           <CommonCardStat
@@ -17,13 +17,13 @@
             text="Structures en réseau"
           />
         </v-col>
-        <v-col cols="3" class="d-flex justify-center align-center">
+        <v-col md="3" class="d-flex justify-center align-center">
           <CommonCardStat
             number="300 000"
             text="Utilisateurs"
           />
         </v-col>
-        <v-col cols="3" class="d-flex justify-center align-center">
+        <v-col md="3" class="d-flex justify-center align-center">
           <CommonCardStat
             number="12"
             text="Années de collaboration"