diff --git a/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/_custom.scss b/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/_custom.scss index 7646e3a0e..308342bec 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/_custom.scss +++ b/src/Bundle/ChillMainBundle/Resources/public/modules/bootstrap/_custom.scss @@ -109,9 +109,6 @@ body { } header { - a { - text-decoration: none; - } nav.navbar { padding: 0; a.navbar-brand img { @@ -121,22 +118,6 @@ header { div.navbar-collapse { float: right; } - @media (max-width: 767px) { - & { - position: relative; - } - button.navbar-toggler { - float: right; - } - div.navbar-collapse { - float: none; - position: absolute; - top: 4em; - right: 0; - z-index: 2; - padding: 1em; - } - } ul.navbar-nav { display: flex; align-items: stretch; @@ -165,6 +146,7 @@ header { border-radius: 0; a.dropdown-item { width: 120%; + border: 0; border-bottom: 1px solid $gray-200; font-size: smaller; i { @@ -173,6 +155,66 @@ header { color: $gray-500 !important; } } } + + // fullwidth menu when navbar is collapsed + @media (max-width: 767px) { + & { + position: relative; + } + button.navbar-toggler { + float: right; + } + div.navbar-collapse { + float: none; + position: absolute; + top: 4em; + left: 0; + right: 0; + z-index: 2; + padding: 1em; + border-top: 1px solid shade-color($primary, 25%); + ul.navbar-nav { + display: grid; + grid-template-areas: + "sear sear sear" + "sect user lang"; + li.nav-item { + flex-direction: column; + border: 0; + a.nav-link {} + &.navigation-search { + grid-area: sear; + margin-bottom: 1em; + form { + width: 100%; + input.form-control {} + button.btn {} + } + } + &.nav-section { grid-area: sect; } + &.nav-user { grid-area: user; } + &.nav-language { grid-area: lang; } + } + li.dropdown { + &, & > * { + background-color: transparent !important; + } + a.dropdown-toggle {} + div.dropdown-menu { + display: block; + border: 0; + a.dropdown-item { + width: 100%; + border: 0; + border-top: 1px dotted $gray-200; + background-color: transparent !important; + } + } + } + } + } + } + } } diff --git a/src/Bundle/ChillMainBundle/Resources/views/Layout/_header.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Layout/_header.html.twig index f5c8ee82b..605be2da6 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Layout/_header.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Layout/_header.html.twig @@ -64,13 +64,13 @@ }) }} {% if available_languages|length == 1 %} - {% else %} -