fela-plugin-important

Warning: Use this plugin with caution. It is not recommended and should only be used as a last resort.

Adds !important to every declaration value except animations item and keyframes. This helps to force specificity over third-party libraries. Animation items and keyframes with !important disrupt functionality of animations. More about.

Installation

yarn add fela-plugin-important

You may alternatively use npm i --save fela-plugin-important.

Usage

Make sure to read the documentation on how to use plugins.

import { createRenderer } from 'fela'
import important from 'fela-plugin-important'

const renderer = createRenderer({
  plugins: [important()],
})

Example

Input

{
  width: '25px',
  display: [ '-webkit-flex', 'flex' ],
  fontWeight: 'normal'
}

Output

{
  width: '25px!important',
  display: [ '-webkit-flex!important', 'flex!important' ],
  fontWeight: 'normal!important'
}

License

Fela is licensed under the MIT License. Documentation is licensed under Creative Commons License. Created with ♥ by @robinweser and all the great contributors.