prebuild navigation according to screen size

components/Layout/Navigation.vue

@@ -4,7 +4,7 @@ Menu Navigation
 <template>
   <div v-intersect="onIntersect">
     <!-- Navigation (écran large) -->
-    <div v-if="lgAndUp || !nuxtReady">
+    <div v-if="lgAndUp || (isLargeScreen && !nuxtReady)">
       <LayoutNavigationLg :menu="menu" />
     </div>
 
@@ -20,14 +20,21 @@ import { useDisplay } from 'vuetify'
 import type { MainMenuItem } from '~/types/interface'
 import { useLayoutStore } from '~/stores/layoutStore'
 
-const { lgAndUp } = useDisplay()
+// Get the initial width (useDisplay won't work during SSR)
+const isLargeScreen =
+  ((typeof window === 'undefined' && 1024) ||
+    window.innerWidth ||
+    document.documentElement.clientWidth ||
+    document.body.clientWidth) >= 1280
 
-// On force la version écran large au build côté serveur
+// On force la version écran large au build côté serveur si l'écran fait plus de 1280px de large
 const nuxtReady = ref(false)
 onNuxtReady(() => {
   nuxtReady.value = true
 })
 
+const { lgAndUp } = useDisplay()
+
 const menu: Array<MainMenuItem> = [
   {
     label: 'Nos logiciels',