mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
fixes #22245: revamp the breakpoint-between and breakpoint-only mixins to actually work
This commit is contained in:
parent
2b3a2b65a9
commit
32ed268c82
1 changed files with 9 additions and 5 deletions
|
@ -78,10 +78,11 @@
|
|||
// Media that spans multiple breakpoint widths.
|
||||
// Makes the @content apply between the min and max breakpoints
|
||||
@mixin media-breakpoint-between($lower, $upper, $breakpoints: $grid-breakpoints) {
|
||||
@include media-breakpoint-up($lower, $breakpoints) {
|
||||
@include media-breakpoint-down($upper, $breakpoints) {
|
||||
@content;
|
||||
}
|
||||
$min: breakpoint-max($lower, $breakpoints);
|
||||
$max: breakpoint-max($upper, $breakpoints);
|
||||
|
||||
@media (min-width: $min) and (max-width: $max) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -89,7 +90,10 @@
|
|||
// No minimum for the smallest breakpoint, and no maximum for the largest one.
|
||||
// Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.
|
||||
@mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {
|
||||
@include media-breakpoint-between($name, $name, $breakpoints) {
|
||||
$min: breakpoint-min($name, $breakpoints);
|
||||
$max: breakpoint-max($name, $breakpoints);
|
||||
|
||||
@media (min-width: $min) and (max-width: $max) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue