fela-plugin-lvha

fela-plugin-lvha

LVHA (sometimes known as LVHFA) stands for Link Visited Hover (Focus) Active which are actually describe pseudo classes. Within CSS their order is relevant which means we always need to sort them correctly. This plugin does include the :focus pseudo class as well.

Installation

npm i --save fela-plugin-lvha

Assuming you are using npm as your package mananger you can just npm install.
Otherwise we also provide a UMD. You can easily use it via unpkg. It registers a FelaPluginLVHA global.

<!-- Fela (Development): Unminified version including all warnings -->
<script src="https://unpkg.com/fela-plugin-lvha@4.0.0/dist/fela-plugin-lvha.js"></script>
<!-- Fela (Production): Minified version -->
<script src="https://unpkg.com/fela-plugin-lvha@4.0.0/dist/fela-plugin-lvha.min.js"></script>

Usage

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

import { createRenderer } from 'fela'
import LVHA from 'fela-plugin-lvha'

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

Example

Input

{
  width: '25px',
  ':hover': {
    color: 'red'
  },
  ':visited': {
    color: 'gray'
  }
  ':link': {
    margin: 0
  }
}

Output

{
  width: '25px',
  ':link': {
    margin: 0
  },
  ':visited': {
    color: 'gray'
  },
  ':hover': {
    color: 'red'
  }
}

License

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