fix header responsiveness

components/Layout/Header/HomeBtn.vue

@@ -5,7 +5,7 @@
         icon="fas fa-home"
         size="small"
         :href="homeUrl"
-        class="ml-2 on-primary"
+        class="on-primary"
     />
     <v-tooltip :activator="btn" :text="$t('welcome')" location="bottom" />
   </div>
@@ -13,10 +13,13 @@
 
 <script setup lang="ts">
   import {ref} from "@vue/reactivity";
+  import {useDisplay} from "vuetify";
 
   const runtimeConfig = useRuntimeConfig()
   const homeUrl = runtimeConfig.baseUrlAdminLegacy
 
+  const { mdAndUp } = useDisplay()
+
   const btn = ref(null);
 </script>
 

components/Layout/Header/Menu.vue

@@ -9,7 +9,6 @@ header principal (configuration, paramètres du compte...)
     <v-btn
         ref="btn"
         icon
-        width="48px"
         size="small"
     >
       <v-avatar

components/Layout/Header/UniversalCreation/CreateButton.vue

@@ -5,11 +5,14 @@ bouton Créer
 <template>
   <main>
     <v-btn
-      elevation="2"
-      class="theme-x-create-btn"
+      elevation="asIcon ? 0 : 2"
+      :class="asIcon ? 'theme-primary' : 'theme-x-create-btn'"
+      :icon="asIcon"
+      :size="asIcon ? 'small' : 'default mr-2'"
       @click="showDialog=true"
     >
-      {{ $t('create') }}
+      <v-icon v-if="asIcon">fas fa-plus</v-icon>
+      <span v-else>{{ $t('create') }}</span>
     </v-btn>
 
     <LayoutDialog :show="showDialog" >
@@ -52,6 +55,7 @@ bouton Créer
 
 <script setup lang="ts">
   import {Ref, ref} from "@vue/reactivity";
+  import {useDisplay} from "vuetify";
 
   const showDialog: Ref<Boolean> = ref(false);
   const step: Ref<Number> = ref(1);
@@ -61,6 +65,9 @@ bouton Créer
     step.value = stepChoice
     type.value = typeChoice
   }
+
+  const { mdAndDown: asIcon } = useDisplay()
+
 </script>
 <style scoped>