From: Mark Otto <markdotto@gmail.com>
Date: Sun, 26 Mar 2017 05:23:40 +0000 (-0700)
Subject: fixes #22245: revamp the breakpoint-between and breakpoint-only mixins to actually... 
X-Git-Tag: v4.0.0-beta~147^2~90
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=32ed268c827672e41382f5ceed5feb4487a22ef2;p=thirdparty%2Fbootstrap.git

fixes #22245: revamp the breakpoint-between and breakpoint-only mixins to actually work
---

diff --git a/scss/mixins/_breakpoints.scss b/scss/mixins/_breakpoints.scss
index 904b60f7ad..be1d034d84 100644
--- a/scss/mixins/_breakpoints.scss
+++ b/scss/mixins/_breakpoints.scss
@@ -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;
   }
 }