feat(navbar): update navbar minimized size to 60px, reduce logo to 30x30

Orange-OpenSource · Jun 24, 2019 · 821912c · 821912c
1 parent 2b961b4
commit 821912c
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 5 deletions.
diff --git a/scss/_navbar.scss b/scss/_navbar.scss
@@ -268,6 +268,11 @@
         //   padding-right: 0;
         //   padding-left: 0;
         // }
+        .navbar-brand {
+          img {
+            margin-bottom: 0;
+          }
+        }
         // boosted mod
       }
 
@@ -287,15 +292,18 @@
         }
 
         &.minimized {
-          padding-top: $navbar-expanded-minimized-padding-y;
-          padding-bottom: 1rem;
+          padding-top: $navbar-expanded-minimized-padding-top;
+          padding-bottom: $navbar-expanded-minimized-padding-bottom;
 
           .navbar-brand {
             img {
               width: $navbar-brand-logo-minimized-height;
               height: $navbar-brand-logo-minimized-height;
             }
           }
+          .navbar-nav {
+            margin-top: 0;
+          }
         }
         // end mod
 
@@ -347,7 +355,7 @@
         }
 
         .navbar-collapse {
-          display: flex !important; // stylelint-disable-line declaration-no-important
+          display: flex; // Boosted mod remove important it's useless
 
           // Changes flex-bases to auto because of an IE10 bug
           flex-basis: auto;

diff --git a/scss/_o-navbar.scss b/scss/_o-navbar.scss
@@ -20,6 +20,10 @@
     &[class*="svg-"]::after {
       width: 1.875rem;
       height: 1.875rem;
+      @include media-breakpoint-down(xs) {
+        width: 1.5625rem;
+        height: 1.5625rem;
+      }
     }
 
     .badge {

diff --git a/scss/_variables.scss b/scss/_variables.scss
@@ -785,14 +785,15 @@ $navbar-padding-y:                  0 !default;
 $navbar-padding-x:                  0 !default;
 $navbar-expanded-padding-y:         1.5625rem !default;
 $navbar-expanded-padding-x:         0 !default;
-$navbar-expanded-minimized-padding-y: 1.25rem !default;
+$navbar-expanded-minimized-padding-top: .9375rem !default;
+$navbar-expanded-minimized-padding-bottom: .6875rem !default;
 
 // Boosted mod
 // adapt navbar padding when mobile view
 // $navbar-height:                     6.25rem !default;
 $navbar-brand-logo-height:          1.875rem !default;
 $navbar-brand-logo-expanded-height: 3.125rem !default;
-$navbar-brand-logo-minimized-height: 2.5rem !default;
+$navbar-brand-logo-minimized-height: 1.875rem !default;
 $navbar-supra-height:               2.5rem !default;
 // end mod