Updated to v4.0.0-beta.3

README.md

@@ -4,7 +4,7 @@ Bootstrap 4 grid system and layout utilities.
 
 ## Version
 
-Currently v4.0.0-beta.2
+Currently v4.0.0-beta.3
 
 ## What's Included
 

css/grid.css

@@ -1,5 +1,5 @@
 /*!
- * Bootstrap Grid v4.0.0-beta.2 (https://getbootstrap.com)
+ * Bootstrap Grid v4.0.0-beta.3 (https://getbootstrap.com)
  * Copyright 2011-2017 The Bootstrap Authors
  * Copyright 2011-2017 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bootstrap-4-grid",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "description": "Bootstrap 4 grid system and layout utilities",
   "main": "css/grid.min.css",
   "repository": {
@@ -21,7 +21,7 @@
   "homepage": "https://github.com/m-spyratos/bootstrap-4-grid",
   "devDependencies": {
     "autoprefixer": "^6.7.0",
-    "bootstrap": "^4.0.0-beta.2",
+    "bootstrap": "^4.0.0-beta.3",
     "grunt": "^1.0.1",
     "grunt-contrib-copy": "^1.0.0",
     "grunt-contrib-sass": "^1.0.0",

scss/breakpoints/mixins/_breakpoints.scss

@@ -29,13 +29,15 @@
 }
 
 // Maximum breakpoint width. Null for the largest (last) breakpoint.
-// The maximum value is calculated as the minimum of the next one less 0.1.
+// The maximum value is calculated as the minimum of the next one less 0.01px
+// to work around the limitations of `min-` and `max-` prefixes and viewports with fractional widths.
+// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max
 //
 //    >> breakpoint-max(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
 //    767px
 @function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
   $next: breakpoint-next($name, $breakpoints);
-  @return if($next, breakpoint-min($next, $breakpoints) - 1px, null);
+  @return if($next, breakpoint-min($next, $breakpoints) - .01px, null);
 }
 
 // Returns a blank string if smallest breakpoint, otherwise returns the name with a dash infront.

scss/grid/_functions.scss

@@ -56,14 +56,14 @@
 
   $yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000;
 
-  @if ($yiq >= 150) {
-    @return #111;
+  @if ($yiq >= $yiq-contrasted-threshold) {
+    @return $yiq-text-dark;
   } @else {
-    @return #fff;
+    @return $yiq-text-light;
   }
 }
 
-// Retreive color Sass maps
+// Retrieve color Sass maps
 @function color($key: "blue") {
   @return map-get($colors, $key);
 }

scss/grid/bootstrap-grid.scss

@@ -1,5 +1,5 @@
 /*!
- * Bootstrap Grid v4.0.0-beta.2 (https://getbootstrap.com)
+ * Bootstrap Grid v4.0.0-beta.3 (https://getbootstrap.com)
  * Copyright 2011-2017 The Bootstrap Authors
  * Copyright 2011-2017 Twitter, Inc.
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)

scss/grid/mixins/_breakpoints.scss

@@ -29,13 +29,15 @@
 }
 
 // Maximum breakpoint width. Null for the largest (last) breakpoint.
-// The maximum value is calculated as the minimum of the next one less 0.1.
+// The maximum value is calculated as the minimum of the next one less 0.01px
+// to work around the limitations of `min-` and `max-` prefixes and viewports with fractional widths.
+// See https://www.w3.org/TR/mediaqueries-4/#mq-min-max
 //
 //    >> breakpoint-max(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
 //    767px
 @function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
   $next: breakpoint-next($name, $breakpoints);
-  @return if($next, breakpoint-min($next, $breakpoints) - 1px, null);
+  @return if($next, breakpoint-min($next, $breakpoints) - .01px, null);
 }
 
 // Returns a blank string if smallest breakpoint, otherwise returns the name with a dash infront.