From 385390124d042fc41a87435398137da7263b84d9 Mon Sep 17 00:00:00 2001 From: chomik Date: Sat, 1 Jun 2019 20:30:25 +0200 Subject: [PATCH] top navbar fixes --- pages/_includes/layout/topnav.html | 4 +- pages/_includes/parts/navbar.html | 80 ++++++++---------------------- scss/_variables.scss | 8 +-- scss/layout/_navbar.scss | 67 ++++--------------------- scss/ui/_buttons.scss | 4 ++ 5 files changed, 39 insertions(+), 124 deletions(-) diff --git a/pages/_includes/layout/topnav.html b/pages/_includes/layout/topnav.html index 4c71d8c00..c169f5ec5 100644 --- a/pages/_includes/layout/topnav.html +++ b/pages/_includes/layout/topnav.html @@ -1,5 +1,5 @@ -
- {% include parts/navbar.html logo=true search=true user-menu=1 person=5 dark=false white-logo=include.dark %} +
+ {% include parts/navbar.html logo=true search=true user-menu=1 person=5 white-logo=include.dark %}
{% comment %} diff --git a/pages/_includes/parts/navbar.html b/pages/_includes/parts/navbar.html index 77e117d4e..b12bb6dbd 100644 --- a/pages/_includes/parts/navbar.html +++ b/pages/_includes/parts/navbar.html @@ -3,16 +3,16 @@ {% assign person = person[0] %}
- - {% include ui/icon.html icon="menu" %} + + - + {% if include.icon %}{% include ui/icon.html icon=include.icon %}{% endif %} {% if include.stamp %}UI{% endif %} {% if include.logo %} - - + + {% endif %} {% if include.title %}{{ include.title }}{% endif %} @@ -21,7 +21,7 @@
{% include ui/icon.html icon="search" %} - +
{% endif %} @@ -32,46 +32,6 @@ {% endif %} - - -
diff --git a/scss/_variables.scss b/scss/_variables.scss index 835f3f348..793b86974 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -11,11 +11,11 @@ $icon-fonts: ( // COLORS $full-black: rgba(0, 0, 0, 1) !default; -$light-black: rgba(0, 0, 0, .35) !default; -$min-black: rgba(135, 150, 165, .1) !default; $full-white: rgba(255, 255, 255, 1) !default; -$light-white: rgba(255, 255, 255, .35) !default; -$min-white: rgba(255, 255, 255, .1) !default; +$light-black: rgba(0, 0, 0, .4) !default; +$light-white: rgba(255, 255, 255, .4) !default; +$min-black: rgba(135, 150, 165, .064) !default; +$min-white: rgba(255, 255, 255, .064) !default; $gray-100: #f8f9fa !default; $gray-200: #e9ecef !default; diff --git a/scss/layout/_navbar.scss b/scss/layout/_navbar.scss index 7fa9b0967..1b8aae1cd 100644 --- a/scss/layout/_navbar.scss +++ b/scss/layout/_navbar.scss @@ -41,6 +41,15 @@ height: 2rem; } +/** +Navbar toggler + */ +.navbar-toggler-icon { + width: 2rem; + height: 2rem; + background: red; +} + /** Fixed navbar */ @@ -60,64 +69,6 @@ Fixed navbar } } -/** -Navbar expand - */ -@each $breakpoint, $dimension in $grid-breakpoints { - .navbar-expand-#{$breakpoint} { - display: none; - - @include media-breakpoint-up(#{$breakpoint}) { - display: block; - padding-right: 0; - padding-left: 0; - - .navbar-nav { - margin-right: 0; - margin-left: 0; - } - - .navbar-nav .nav-link { - padding: .5rem $sidenav-link-padding-x; - - &.active { - position: relative; - - &::before { - top: auto; - right: $sidenav-link-padding-x; - bottom: calc(-#{$navbar-padding-y} - #{$border-width}); - left: $sidenav-link-padding-x; - border-bottom: 1px solid $primary; - border-left: 0; - } - } - } - - - > .container, - > .container-fluid { - padding-right: 0; - padding-left: 0; - } - - &.navbar-side.navbar-fixed { - @include media-breakpoint-up(#{$breakpoint}) { - ~ .main-content { - margin-left: $sidenav-width; - } - - &.navbar-right ~ .main-content { - margin-right: $sidenav-width; - margin-left: 0; - } - } - } - } - } -} - - /* Sidebar */ diff --git a/scss/ui/_buttons.scss b/scss/ui/_buttons.scss index c0cabdbfe..ae5532a79 100644 --- a/scss/ui/_buttons.scss +++ b/scss/ui/_buttons.scss @@ -1,6 +1,10 @@ .btn { letter-spacing: .03em; box-shadow: 0 1px 1px rgba(0, 0, 0, .03); + + .flag { + vertical-align: -5px; + } } .btn-avatar {