mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-28 15:50:01 +02:00
Code Issues Releases Wiki Activity

Generate correct breakpoints for navbar-toggleable-* and generate toggleable without media query to never collapse

Browse Source
This commit is contained in:
Pierre-Denis Vanduynslager
2017-01-13 23:05:33 -05:00
committed by Mark Otto
parent d0b568470f
commit c1325a756e
3 changed files with 35 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
scss/_navbar.scss
View File

@@ -126,11 +126,11 @@
// where your navbar collapses.
.navbar-toggleable {
@each $breakpoint in map-keys($grid-breakpoints) {
$next: breakpoint-next($breakpoint, $grid-breakpoints);
$previous: breakpoint-previous($breakpoint, $grid-breakpoints);
$infix: breakpoint-infix($breakpoint, $grid-breakpoints);
&#{$infix} {
@include media-breakpoint-down($breakpoint) {
@include media-breakpoint-down($previous) {
.navbar-nav {
.dropdown-menu {
position: static;
@@ -144,7 +144,7 @@
}
}
@include media-breakpoint-up($next) {
@include media-breakpoint-up($breakpoint) {
flex-direction: row;
flex-wrap: nowrap;
align-items: center;

15
scss/mixins/_breakpoints.scss
View File

@@ -16,9 +16,22 @@
// md
@function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {
$n: index($breakpoint-names, $name);
@return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
@return if($n, if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null), null);
}
// Name of the previous breakpoint, or null for the first breakpoint.
//
// >> breakpoint-previous(sm)
// xs
// >> breakpoint-next(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
// xs
// >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))
// xs
@function breakpoint-previous($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {
$n: index($breakpoint-names, $name);
@return if($n != 1, nth($breakpoint-names, $n - 1), null);
};
// Minimum breakpoint width. Null for the smallest (first) breakpoint.
//
// >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))