From b9d1d14d3a35cae75f858314a7ba4b4c4bd8b910 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ga=C3=ABl=20Poupard?= Date: Tue, 2 Jul 2019 16:14:39 +0200 Subject: [PATCH] feat(megamenu): improve links style in mega-menu-panel --- scss/_o-megamenu.scss | 36 ++++--- scss/_o-navbar.scss | 17 +-- .../4.3/essentials/global-headers/index.html | 102 ++++++++++-------- 3 files changed, 81 insertions(+), 74 deletions(-) diff --git a/scss/_o-megamenu.scss b/scss/_o-megamenu.scss index cc6cb8c02d..7f9ea10e23 100644 --- a/scss/_o-megamenu.scss +++ b/scss/_o-megamenu.scss @@ -5,23 +5,29 @@ .mega-menu { overflow: hidden; -} -.mega-menu > .navbar-nav { - transition: transform .5s; - transform: translateX(0); + > .navbar-nav { + transition: transform .5s; + transform: translateX(0); + } } -.mega-menu-panel > .navbar-nav, -.mega-menu-panel > .container > .navbar-nav { - flex-direction: column; -} +.mega-menu-panel { + .navbar-nav { + flex-direction: column; + + .navbar-nav { + position: absolute; + top: 0; + left: 100%; + display: none; + width: 100%; + } + } -.mega-menu-panel > .navbar-nav .navbar-nav, -.mega-menu-panel > .container > .navbar-nav .navbar-nav { - position: absolute; - top: 0; - left: 100%; - display: none; - width: 100%; + .container { + @include media-breakpoint-down(lg) { + max-width: 100%; + } + } } diff --git a/scss/_o-navbar.scss b/scss/_o-navbar.scss index caf157dc4d..e783a280d6 100644 --- a/scss/_o-navbar.scss +++ b/scss/_o-navbar.scss @@ -49,7 +49,7 @@ min-height: $navbar-supra-height; padding-top: 0; padding-bottom: 0; - border-bottom: 1px solid $gray-900; + border-bottom: 1px solid $gray-700; > .container, > .container .navbar-nav { @@ -148,15 +148,6 @@ a[data-toggle="collapse"] { display: none; } - - > .navbar-nav > .nav-item { - padding: 0; - border: 0; - } - - > .navbar-nav .navbar-nav .nav-item:last-child { - border-bottom: 1px solid #333; - } } } } @@ -183,7 +174,7 @@ width: 100%; padding: 1rem 0; background-color: #000; - border-top: 1px solid #333; + border-top: 1px solid $gray-700; a[data-toggle="collapse"] { display: block; @@ -217,6 +208,8 @@ margin-right: .625rem; margin-bottom: 1rem; font-size: 1.25rem; + border-bottom: 1px solid $gray-700; + } > .container > .navbar-nav .navbar-nav { @@ -228,7 +221,7 @@ > .container > .navbar-nav .navbar-nav .nav-link { padding: 0; - line-height: 1.25rem; + line-height: 1.75rem; outline-offset: 1px; } diff --git a/site/docs/4.3/essentials/global-headers/index.html b/site/docs/4.3/essentials/global-headers/index.html index 4bbaea0c81..696a1b0a9b 100644 --- a/site/docs/4.3/essentials/global-headers/index.html +++ b/site/docs/4.3/essentials/global-headers/index.html @@ -147,17 +147,19 @@

Global header with additional icons

  • -
    - View all shop - +
    +
    + View all shop + +