few responsive adapations + langage switcher

resources/css/layout/menu-homegrade.css

@@ -8,7 +8,9 @@
     w-full
     h-fit
     py-4
-    px-8 
+    px-4
+    md:px-0
+    xl:px-8 
     2xl:px-32
      my-0;
 
@@ -23,8 +25,8 @@
        lg:mx-0
        static
        bottom-0
-       translate-y-full
-       lg:absolute;
+       lg:translate-y-full
+       xl:absolute;
     z-index: 999;
     display: none;
 
@@ -57,7 +59,7 @@
 
   &__navlist {
     @apply w-full
-    max-w-screen-2xl mx-auto lg:flex justify-end pr-0;
+    max-w-screen-2xl mx-auto lg:flex justify-center pr-0;
 
     /* Highlight using list element */
     li.current-page-parent > a,
@@ -75,7 +77,8 @@
       button,
       a {
         @apply block
-        px-4
+        px-2
+        xl:px-4
         py-2;
       }
       &:hover,
@@ -183,63 +186,22 @@
       @apply hidden;
     }
   }
-  /*##### RESPONSIVE */
-
-  /* @media (max-width: 960px) {
-    &__wrapper-container {
-      @apply mt-0
-          left-0
-          z-40
-          absolute
-          hidden;
-
-      min-height: 100vh;
-      height: fit-content;
-      top: 0;
-      width: 100vw;
-
-      // Rendu conditionnel de l'élément si contenu dans une classe de parent  (nesting inversé)
-
-      .nav-open & {
-        @apply flex;
+  .wpml-ls-item-nl {
+    @apply xl:ml-8;
   }
+  .wpml-ls-item {
+    @apply px-1;
 
-      > ul {
-        @apply max-w-xs
-            mx-auto;
-        padding-top: 5vh;
-      }
-      li.menu-item {
-        @apply mt-0
-            text-center
-            text-white
-            font-medium
-            py-8
-            text-lg
-            !block
-            pb-0;
-
-        .sub-menu li {
-          @apply text-sm;
+    a {
+      @apply !rounded-full  h-10 w-10 border border-2 border-white p-0 !flex justify-center items-center font-semibold text-sm;
+      box-sizing: border-box;
     }
   }
+  .wpml-ls-current-language {
+    a {
+      @apply bg-white text-primary font-bold;
     }
-
-    // BURGER MENU
-    body:has(.nav-open) {
-      @apply max-h-screen
-        overflow-hidden;
   }
-  } */
-
-  /* @media (max-width: 960px) and (hover: none) {
-    li.menu-item {
-      @apply mx-auto 
-    }
-  } */
-}
-
-.menu-homegrade--header {
 }
 
 .menu-homegrade--footer {