0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-29 11:24:18 +01:00
Bootstrap/site/assets/scss/_navbar.scss
Martijn Cuppens 7e28764e67 Change breakpoint-max implementation
- The `media-breakpoint-down()` uses the breakpoint itself instead of the next breakpoint. Use `media-breakpoint-down(lg)` instead of `media-breakpoint-down(md)` to target viewports smaller than the `lg` breakpoint.
- The `media-breakpoint-between()` mixin's second parameter also uses the breakpoint itself instead of the next breakpoint. Use `media-between(sm, lg)` instead of `media-breakpoint-between(sm, md)` to target viewports between the `sm` and `lg` breakpoints.
2020-06-14 14:50:47 -07:00

39 lines
596 B
SCSS

.bd-navbar {
padding: .625rem 0;
background-color: $bd-purple-bright;
@include media-breakpoint-down(lg) {
.navbar-nav-scroll {
width: 100%;
.navbar-nav {
margin: -.5rem 0;
overflow-x: auto;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}
}
}
.navbar-nav {
.nav-link {
color: rgba($white, .85);
&:hover,
&:focus {
color: $white;
}
&.active {
font-weight: 600;
color: $white;
}
}
}
.navbar-nav-svg {
width: 1rem;
height: 1rem;
}
}