Module: Breakpoints
The breakpoints module keeps Sass maps of named breakpoints and provides some mixins to apply them.
You'll find it in src/modules/_breakpoints.scss.
If you want more than just mixins, e.g. breakpoints in CSS custom properties, consider importing the breakpoints extension.
Device breakpoints
The device breakpoints are inspired by David Gilbertson's somewhat controversial article The 100% correct way to do CSS breakpoints and has mixins to use them:
for-phone-onlyfor-tablet-portrait-upfor-tablet-landscape-upfor-desktop-upfor-big-desktop-up
Current device breakpoint:
Other named breakpoins
The function get-breakpoint will find a breakpoint value from the $device-breakpoins
and $named-breakpoints Sass maps combined.
You can use this function in your own media queries.
Configure your own breakpoints by setting the Sass maps before importing the module. Some (i.e. most) of you won't like the device breakpoints, and if so you can add your own small/medium/large/etc breakpoints to $named-breakpoints.
Some breakpoints will be automatically registered if the Sass variables they depend on have been set by other modules:
readable-line-length-mineadable-line-length-maxtwo-columns