1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-31 09:05:47 +02:00

Navbar optimizations (#29864)

- Remove redundant `display: inline-block` from flex children
- Remove `line-height: inherit;` which is the default value of `line-height`
- Use flex shorthand
- Improve background shorthand
- Fix removed brand margin caused by requiring containers in navbars
This commit is contained in:
Martijn Cuppens
2019-12-25 17:38:41 +01:00
committed by XhmikosR
parent 7b78456be8
commit 74e45ebc07
2 changed files with 6 additions and 9 deletions

View File

@@ -52,12 +52,10 @@
// Used for brand, project, or site names.
.navbar-brand {
display: inline-block;
padding-top: $navbar-brand-padding-y;
padding-bottom: $navbar-brand-padding-y;
margin-right: $navbar-padding-x;
margin-right: $navbar-brand-margin-right;
@include font-size($navbar-brand-font-size);
line-height: inherit;
white-space: nowrap;
&:hover,
@@ -94,7 +92,6 @@
//
.navbar-text {
display: inline-block;
padding-top: $nav-link-padding-y;
padding-bottom: $nav-link-padding-y;
}
@@ -109,8 +106,7 @@
// the default flexbox row orientation. Requires the use of `flex-wrap: wrap`
// on the `.navbar` parent.
.navbar-collapse {
flex-basis: 100%;
flex-grow: 1;
flex: 1 0 100%;
// For always expanded or extra full navbars, ensure content aligns itself
// properly vertically. Can be easily overridden with flex utilities.
align-items: center;
@@ -138,9 +134,9 @@
width: 1.5em;
height: 1.5em;
vertical-align: middle;
content: "";
background: no-repeat center center;
background-size: 100% 100%;
background-repeat: no-repeat;
background-position: center;
background-size: 100%;
}
// Generate series of `.navbar-expand-*` responsive classes for configuring