v4.0.0
Added
u-bg
classes can now be made available at different breakpoints by overriding the$bitstyles-bg-breakpoints
variableu-fg
classes can now be made available at different breakpoints by overriding the$bitstyles-fg-breakpoints
variable- Default settings for
u-fg
classes now includewhite
as an option u-font
classes can now be customized by overriding the$bitstyles-font-weight-values
and$bitstyles-font-style-values
variables. They can be made available at different breakpoints by overriding the$bitstyles-font-weight-breakpoints
and$bitstyles-font-style-breakpoints
variablesu-text
classes can now be customized by overriding the$bitstyles-text-values
variable. They can be made available at different breakpoints by overriding the$bitstyles-text-breakpoints
variableu-overflow
classes are now also available forscroll
,hidden
, andauto
by default, and can be set by overriding$bitstyles-overflow-values
- You can now override the font styles for
input-text
s,selects
, andbuttons
. - New
u-font
classes to specify font-family. Defaults tou-font-header
andu-font-body
, which apply the respective font stack as specified insettings/typography
. This can be overridden using$bitstyles-font-family-values
, and can be made responsive by specifying breakpoints in$bitstyles-font-family-breakpoints
- Color & background-color of the
html
element can now be specified using$bitstyles-html-color
and$bitstyles-html-background-color
, and default to thetext
andbackground
colors specified in your global color-palette - Default key-name to return when asking for a color without specifying it (e.g.
palette.get('white')
) can now be set using$bitstyles-color-palette-default-key
- There’s now a helper function
font-size.get($font-size, $breakpoint)
which returns font-sizes from the global map
Fixed
- The height of inputs, selects, and
.a-button
s now matches regardless of the border-width - Modals now only show scrollbars (on OSes/configs where scrollbars are shown) when they’re needed
- Typographic scale of base elements is no longer prefixed when a prefix is specified
Changed
- The font-sizes specified in
settings/typography
$font-sizes
map should now userem
units instead ofpx
. The Sass will still compile if you specify usingpx
as before, but the resulting CSS will not follow current best practices (to userem
units for specifying font-size)
Breaking
- All utility classes which had a double dash in their classname (
--
) now only have a single dash. You’ll need to rename all these classes to use single dashes e.g..u-bg--brand-1
becomes.u-bg-brand-1
- Values for the display classes (
u-block
,u-flex
etc.) will now need to be set unquoted. If you previously were overriding the$bitstyles-display-values
variable, make sure all the values on the right hand side are unquoted CSS values e.g.'block': block
instead of'block': 'block'
, as was previously possible - If you were using the
$bitstyles-input-padding
variable, you’ll now need to set$bitstyles-input-padding-vertical
and$bitstyles-input-padding-horizontal
separately - The
u-overflow-x
andu-overflow-y
classes were renamed tou-overflow-x-auto
andu-overflow-y-auto
, respectively - The media-query/breakpoint mixin is no longer called using
media-query.media-query()
. You’ll need to update all uses of this tomedia-query.get()
- Removes the
unit-conversions
functions
PRs
- [#544] Update remaining utility classes to using single-dash naming by @planktonic in #546
- [#576] select remove half the border width from vertical padding by @planktonic in #581
- Updates browserslist & dependencies by @planktonic in #579
- [#574] modal scrollbars when external mouse is connected by @planktonic in #582
- [#575] overflow scroll utilities by @planktonic in #580
- [#583] add utility font family by @planktonic in #584
- [#586] variables to set color background color of html by @planktonic in #589
- [#587] variable to specify default value for palette get by @planktonic in #590
- [#585] get() for font sizes by @planktonic in #594
- Bump version 4.0.0 by @planktonic in #598
Full Changelog: v3.1.0...v4.0.0