Skip to content

Commit

Permalink
Update README.md (#95)
Browse files Browse the repository at this point in the history
Updated default theme keys to DEFAULT to match tailwind 2.x configuration

Co-authored-by: Robin Malfait <malfait.robin@gmail.com>
  • Loading branch information
frankspin89 and RobinMalfait committed Dec 14, 2020
1 parent 5136c73 commit 443aed3
Showing 1 changed file with 4 additions and 4 deletions.
8 changes: 4 additions & 4 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -220,17 +220,17 @@ module.exports = {
}
```

Customizations should be applied to a specific modifier like `default` or `xl`, and must be added under the `css` property. Customizations are authored in the same [CSS-in-JS syntax](https://tailwindcss.com/docs/plugins#css-in-js-syntax) used to write Tailwind plugins.
Customizations should be applied to a specific modifier like `DEFAULT` or `xl`, and must be added under the `css` property. Customizations are authored in the same [CSS-in-JS syntax](https://tailwindcss.com/docs/plugins#css-in-js-syntax) used to write Tailwind plugins.

It's important to note that all customizations are **merged** with the defaults. If you'd like to completely override a provided size modifier, you can do so by disabling that modifier so the default styles are not included.

See [the default styles](./src/styles.js) for this plugin for more in-depth examples of configuring each modifier.

### Customizing shared styles

Many styles _(for example colors, font weight, and text decoration)_ are shared between all size modifiers, and are therefore defined only for the `default` modifier, since modifiers are designed to be used with the [multi-class modifier pattern](http://nicolasgallagher.com/about-html-semantics-front-end-architecture/#component-modifiers).
Many styles _(for example colors, font weight, and text decoration)_ are shared between all size modifiers, and are therefore defined only for the `DEFAULT` modifier, since modifiers are designed to be used with the [multi-class modifier pattern](http://nicolasgallagher.com/about-html-semantics-front-end-architecture/#component-modifiers).

If you'd like to customize these sorts of styles, do so using the `default` modifier:
If you'd like to customize these sorts of styles, do so using the `DEFAULT` modifier:

```js
// tailwind.config.js
Expand Down Expand Up @@ -326,7 +326,7 @@ module.exports = {

This option acts as a _safelist_, so you can list only the modifiers you'd actually like included and the others will be removed.

The `default` modifier is always included and cannot be disabled.
The `DEFAULT` modifier is always included and cannot be disabled.

### Disabling responsive variants

Expand Down

0 comments on commit 443aed3

Please sign in to comment.