🐛 fix(header, navigation): focus des nav-items mobile & ajustements […

…DS-3216] (#609)

- L'outline de focus est maintenant entièrement visible sur les liens des sous menu en mobile
- Ajustement de l'alignement du bouton fermé en desktop
- Retrait du mega-menu__leader vide dans les examples

src/component/header/style/module/_nav.scss

@@ -10,6 +10,7 @@
 
       &__list {
         max-width: calc(100% + #{space(4v)});
+        @include margin(0 -4v);
       }
     }
   }

src/component/navigation/example/sample/navigation.ejs

@@ -64,7 +64,7 @@ const getMega = (active = false, leader = false) => {
     type: 'mega-menu',
     label: 'Entrée mega menu',
     close: 'Fermer le menu',
-    leader: leader ? {
+    ...(leader && {leader: {
       title: 'Titre éditorialisé',
       text: lorem(),
       link: {
@@ -73,7 +73,7 @@ const getMega = (active = false, leader = false) => {
         iconPlace:'right',
         icon: 'arrow-right-line'
       }
-    } : null,
+  }}),
     categories: [
       getCategory(),
       getCategory(),

src/component/navigation/style/module/_default.scss

@@ -19,7 +19,6 @@
     @include respond-from(lg) {
       flex-direction: row;
       flex-wrap: nowrap;
-      @include margin(0 -4v);
 
       & > *:first-child:nth-last-child(2) ~ *,
       & > *:first-child:nth-last-child(3) ~ *,

src/component/navigation/style/module/_mega-menu.scss

@@ -5,15 +5,14 @@
 
 #{ns(mega-menu)} {
   @include margin(0 -4v 1px);
-  @include padding(0 4v 0);
 
   @include respond-from(lg) {
     @include absolute(100%, 0, null, 0);
     @include margin(0);
     @include padding(0);
 
     @include after('', block) {
-      @include padding-bottom(9v);
+      @include padding-bottom(6v);
     }
   }
 
@@ -22,6 +21,8 @@
   }
 
   > #{ns(container)} {
+    @include padding(2v 4v 0);
+    @include padding(0 6v, lg);
     @include respond-from(lg) {
       @include before('', block) {
         @include padding-top(4v);
@@ -33,6 +34,7 @@
     display: none;
     @include respond-from(lg) {
       display: flex;
+      @include margin-right(0);
     }
   }
 
@@ -47,7 +49,7 @@
   &__leader {
     @include enable-underline;
     @include padding-x(4v);
-    @include padding-top(4v);
+    @include padding-top(2v);
     @include padding-top(0, lg);
     @include padding-x(0, lg);
     @include set-text-margin(0 0 2v);

src/component/sidemenu/style/module/_list.scss

@@ -8,8 +8,8 @@
     font-weight: font-weight('bold');
 
     #{ns(sidemenu__list)} {
-      @include margin(0 2v 6v);
-      @include margin(0 4v, md);
+      @include margin(0 2v 4v);
+      @include margin(0 4v 4v, md);
       font-weight: font-weight();
 
       #{ns(sidemenu__link)},