mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-31 00:59:51 +02:00
Code Issues Releases Wiki Activity

Add support for fractional viewport widths (zoom/high-dpi displays) (#24299)

Browse Source 
* Change breakpoint  max- calculation to fractional values
* Update docs to reflect fractional max-width breakpoint values
* Add fractional max-width to offcanvas example
* Add documentation and SCSS comment for fractional viewport support
This commit is contained in:
Patrick H. Lauke
2017-11-20 05:13:37 -05:00
committed by GitHub
parent 0f17d53770
commit dcb761350c
5 changed files with 24 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
scss/mixins/_breakpoints.scss
View File

@@ -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.