fela-plugin-unit

Always writing length values as string with a value applied seems not like the JavaScript way to do it. You can also use mathematics to process number values.

It is aware of unitless properties such as lineHeight, zero-values and also adds units to multiple values inside an array.

Installation

``sh
yarn add fela-plugin-unit
`

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

Usage

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

`javascript
import { createRenderer } from 'fela'
import unit from 'fela-plugin-unit'

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

$3

##### Parameters

|  Parameter | Value | Default | Description |
| ------------------ | ------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------- | --------------------------------------------- |
| unit | ch, em, ex, rem, vh, vw, vmin, vmax, px, cm, mm, in, pc, pt, mozmm |  px | unit which gets applied |
| unitPerProperty |  (Object) | {} |  Default units per property |
| isUnitlessProperty | _(Function)_ | util function | check whether property should remain unitless |

##### Example

`javascript
import { createRenderer } from 'fela'
import unit from 'fela-plugin-unit'

const unitPlugin = unit('em', {
margin: '%',
fontSize: 'pt',
})

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

Example

Using the above example code:

#### Input

`javascript
{
marginTop: 0,
width: 25,
lineHeight: 1.4,
height: '53',
fontSize: 15,
margin: 10
}
`

#### Output

`javascript
{
marginTop: 0,
width: '25em',
lineHeight: 1.4,
height: '53em',
fontSize: '15pt',
margin: '10%'
}
``

License

Fela is licensed under the MIT License.

Documentation is licensed under Creative Commons License.

Created with ♥ by @robinweser and all the great contributors.