Adds style isolation to every rule by attaching all: initial
to every class.
yarn add fela-plugin-isolation
You may alternatively use npm i --save fela-plugin-isolation
.
Make sure to read the documentation on how to use plugins.
import { createRenderer } from 'fela'
import isolation from 'fela-plugin-isolation'
const renderer = createRenderer({
plugins: [ isolation() ]
})
Parameter | Value | Default | Description |
---|---|---|---|
exclude | (Array) | [] |
CSS properties that will not be isolated |
import { createRenderer } from 'fela'
import isolation from 'fela-plugin-isolation'
const isolationPlugin = isolation({
exclude: [
'boxSizing',
'display'
]
})
const renderer = createRenderer({
plugins: [ isolationPlugin ]
})
Using the above example code:
{
fontSize: 15,
color: 'red'
}
{
all: 'initial',
boxSizing: 'inherit',
display: 'inherit',
fontSize: 15,
color: 'red'
}
To disable style isolation for single rules, simply add the isolation: false
property to that rule.
const rule = props => ({
isolation: false,
fontSize: 15,
color: 'red'
})
Fela is licensed under the MIT License.
Documentation is licensed under Creative Common License.
Created with ♥ by @rofrischmann and all the great contributors.