Skip to content

1.12.0

Compare
Choose a tag to compare
@ben-rogerson ben-rogerson released this 28 Oct 10:40
· 630 commits to master since this release

New: The theme import can now return objects (#169)

This update makes the theme import more useful for tasks like theming and creating breakpoint helpers:

const redThemeColors = Object.values(theme`colors.red`)
const breakpoints = theme`screens`

New: A config option to disable css color variables (#173)

Adding disableColorVariables: false to your twin config removes css variables from colors.
This makes it easier to work with complex animations or better support IE11 and react native.

New: Variants: not-disabled:, all:, all-child: (#178)

We can now style non-disabled form elements with not-disabled:xxx.
Stye all descendants with all:xxx (* { xxx }) or just the direct children with the all-child:xxx (> * { xxx }) variant.

New: Target svgs with the svg: variant and lock the stroke width with stroke-non-scaling (#178)

Target svgs from a parent container with the svg: variant and add vector-effect: non-scaling-stroke to svg descendants with the stroke-non-scaling class.

Fix: The GlobalStyles import now adds keyframes from your tailwind config (#172)

When you now use the GlobalStyles import, it will pull in the keyframes from your tailwind config so they're added once to your project.
GlobalStyles now acts more as a replacement for Tailwinds @tailwind base;.