rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-22 19:54:22 +01:00
Code Issues Actions Packages Releases Activity

New $grid-breakpoint-max-offset Sass variable

Browse Source
This commit is contained in:
Julien Déramond 2025-01-30 16:22:20 +01:00
parent 5708adc816
commit be764630de
No known key found for this signature in database
GPG Key ID: EE5F274EA1F477FA
2 changed files with 6 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
scss/_variables.scss
View File

@ -480,6 +480,8 @@ $paragraph-margin-bottom: 1rem !default;
// Define the minimum dimensions at which your layout will change, // Define the minimum dimensions at which your layout will change,
// adapting to different screen sizes, for use in media queries. // adapting to different screen sizes, for use in media queries.
$grid-breakpoint-max-offset: .02 !default;
// scss-docs-start grid-breakpoints // scss-docs-start grid-breakpoints
$grid-breakpoints: ( $grid-breakpoints: (
xs: 0, xs: 0,

7
scss/mixins/_breakpoints.scss
View File

@ -32,8 +32,9 @@
} }
// Maximum breakpoint width. // Maximum breakpoint width.
// The maximum value is reduced by 0.02px to work around the limitations of // The maximum value is reduced by `$grid-breakpoint-max-offset` (0.02px)
// `min-` and `max-` prefixes and viewports with fractional widths. // 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 // See https://www.w3.org/TR/mediaqueries-4/#mq-min-max
// Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari. // Uses 0.02px rather than 0.01px to work around a current rounding bug in Safari.
// See https://bugs.webkit.org/show_bug.cgi?id=178261 // See https://bugs.webkit.org/show_bug.cgi?id=178261
@ -42,7 +43,7 @@
// 767.98px // 767.98px
@function breakpoint-max($name, $breakpoints: $grid-breakpoints) { @function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
$max: map-get($breakpoints, $name); $max: map-get($breakpoints, $name);
@return if($max and $max > 0, $max - .02, null); @return if($max and $max > 0, $max - $grid-breakpoint-max-offset, null);
} }
// Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front. // Returns a blank string if smallest breakpoint, otherwise returns the name with a dash in front.