0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-04 16:24:22 +01:00
Commit Graph

31 Commits

Author SHA1 Message Date
Metadavid
9ccee925fb Update _breakpoints.scss 2022-04-20 11:24:43 -07:00
Richard Giraud
3aaaa01ffa media-breakpoint-only now passes $breakpoints int breakpoint-max. Fixes #35084. 2022-02-24 13:18:16 -08:00
Gaël Poupard
7058f89286 fix(breakpoints): use next breakpoint when targetting xs only 2020-08-22 14:36:24 -07:00
Martijn Cuppens
7e28764e67 Change breakpoint-max implementation
- The `media-breakpoint-down()` uses the breakpoint itself instead of the next breakpoint. Use `media-breakpoint-down(lg)` instead of `media-breakpoint-down(md)` to target viewports smaller than the `lg` breakpoint.
- The `media-breakpoint-between()` mixin's second parameter also uses the breakpoint itself instead of the next breakpoint. Use `media-between(sm, lg)` instead of `media-breakpoint-between(sm, md)` to target viewports between the `sm` and `lg` breakpoints.
2020-06-14 14:50:47 -07:00
Ashfahan Khan
c5b1919dea Add Error checking to prevent invalid breakpoint (#28889)
* Add Error checking to prevent invalid breakpoint

Error checking to prevent invalid breakpoint name

* check type rather than value

* Revert "check type rather than value"

This reverts commit 04ab1e652f.

* use of not rather than null
2019-06-17 08:00:36 +02:00
Vincent Langlet
793b83fda8 Avoid null value (#27570) 2018-11-04 08:18:56 +02:00
Johan Beckers
09aca3fb9a Unitless breakpoints
If I want to customise the breakpoints using `em`, I get compatibility errors.

It is good practice to set breakpoints in `em` instead of `px` when users use browser scaling.
See https://zellwk.com/blog/media-query-units/#concluding-the-experiments for more information why someone would like to do this. Only Safari users can get annoyed: https://adamwathan.me/dont-use-em-for-media-queries/

In any case, using a unitless number at line 42 would be very convenient.
2018-10-21 21:31:28 +03:00
Andrew
abb4868626 correct spelling errors (#26837) 2018-07-09 17:59:22 -07:00
Sander Melnikov
216c7ea20f Fix breakpoint mixins for custom breakpoint maps (#25264)
When using the `media-breakpoint-between` or `media-breakpoint-only`
mixins with a custom breakpoint map – not defined as `$grid-breakpoints`
– the mixin incorrectly defaults back to the global `$grid-breakpoints`
map in certain situations. This commit correctly passes on the
`$breakpoints` argument to the other mixins called within the block.
2018-01-13 09:45:21 +02:00
Patrick H. Lauke
7044ea82c1 Patch fractional viewport widths to work around Safari rounding bug (#25177)
Includes simplifying the prose in `tables.md` and adding the bug to the list of browser bugs.

Closes https://github.com/twbs/bootstrap/issues/25166
2018-01-03 09:42:03 +02:00
Patrick H. Lauke
dcb761350c
Add support for fractional viewport widths (zoom/high-dpi displays) (#24299)
* 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
2017-11-20 05:13:37 -05:00
Trent Clowater
7a7589ffc2 Fix media-breakpoint-between (#23997)
* Fix media-breakpoint-between

When compiling .scss that uses media-breakpoint between with xs as the lower bound or xl as the upper bound, a compilation error can occur due to $min/$max being set to null, or the resulting .css can be invalid (see issue #23965).

(This is basically the same fix that was applied to media-breakpoint-only a short time ago).

* Update _breakpoints.scss

Make houndci-bot recommended changes.
2017-10-02 21:38:59 -07:00
Alex Chegodaev
1da730c67f added @content directive to media-breakpoint-only mixin for min and max cases 2017-08-20 11:46:55 -07:00
lucascono
08b89972c5 Fix the min breakpoint in media-breakpoint-between 2017-08-08 00:07:42 -07:00
Ken Paulsen
a47f373e82 Fix mixin media-breakpoint-only
Prevent mixin media-breakpoint-only from breaking when supplying the
first or last entry in $grid-breakpoints.
2017-06-18 02:08:11 -07:00
Mark Otto
32ed268c82 fixes #22245: revamp the breakpoint-between and breakpoint-only mixins to actually work 2017-03-26 13:23:49 -07:00
Pierre-Denis Vanduynslager
89b47efc32 Simplify generation and get rid of previously added "breakpoint-previous" function 2017-03-23 23:02:28 -07:00
Pierre-Denis Vanduynslager
c1325a756e Generate correct breakpoints for navbar-toggleable-* and generate toggleable without media query to never collapse 2017-03-23 23:02:28 -07:00
Rishabh Rajgarhia
2f429fbd77 Update breakpoints in breakpoints.scss comments 2017-01-09 21:05:24 -08:00
sophiegit
eeb49651c6 Update bootstrap/scss/mixins/_breakpoints.scss (#21285)
grid-breakpoint for sm is 576px
https://github.com/twbs/bootstrap/blob/v4-dev/scss/_variables.scss#L186-L192

1._breakpoints.scss
comment  says that grid-breakpoint for sm is 544px,

2.http://v4-alpha.getbootstrap.com/layout/overview/#responsive-breakpoints
current document says that grid-breakpoint for sm is 544px,
but it should be 576px
2016-12-04 16:46:07 -08:00
Starsam80
b226766b62 Remove lots of duplication + minor cleanup (#21238)
* Remove comment that duplicated some code
* Use transition mixin whenever possible
* Create a new function to reduce duplication
* Use the new `breakpoint-infix` method
2016-11-28 13:23:59 -08:00
heath3
d19e762d57 Re-use 'between' mixin for 'only' mixin
Keeps the code DRY in the same way 'between' uses 'up' and 'down'.
2016-06-09 16:07:27 +01:00
Mark Otto
99219bac55 Merge pull request #17317 from dmbaughman/v4-media-breakpoint-between
v4 - Added  mixin to handle media queries that span multiple breakpoints
2015-11-12 23:27:16 -08:00
Gleb Mazovetskiy
eabed0edf8 Change grid and container sizes to px
Changes grid and container sizes to `px`, as the
viewport pixel size does not depend on the font size.

The actual em values were inconsistent with the docs,
while the docs were not the same as the comments:

* `sm` breakpoint was 34em (544px) not 480px.
* `lg` container max-width was 60rem (960px), less gutter than `md`.
  Changed to 940px, same as Bootstrap 3.
* `xl` container max-width was 72.25rem which is 1140px not 1156px.
  Changed to 1140px matching the comment but not the docs.

Addresses #17070 and #17388.
2015-09-27 14:39:17 +01:00
David Baughman
b1fa07b1f7 Adding new line to end of file 2015-09-02 10:09:55 -07:00
David Baughman
026682bf0d Added mixin to handle media queries that span multiple breakpoints 2015-08-25 12:53:14 -07:00
Chris Rebert
807a837afe Remove libsass @media nesting bug workaround
https://github.com/sass/libsass/issues/185 has been fixed.
Refs #48
2015-01-08 21:41:33 +00:00
Gleb Mazovetskiy
720d02c5e5 Revert "Remove libsass @media nesting bug workaround"
This reverts commit d6a5ebf438.

There has not been a release of libsass with this fix yet, sorry!
2015-01-08 21:38:12 +00:00
Chris Rebert
d6a5ebf438 Remove libsass @media nesting bug workaround
https://github.com/sass/libsass/issues/185 has been fixed.
Refs #48
2015-01-07 19:17:45 -08:00
Chris Rebert
746e09f8ae rename media-breakpoint-{min,max} => media-breakpoint-{up,down} 2015-01-06 17:47:13 -08:00
Gleb Mazovetskiy
93f51eb0e9 Automate breakpoints
Breakpoints and container widths are now defined as maps.
2014-12-24 22:27:11 +02:00