Skip to content
This repository has been archived by the owner on Jan 11, 2019. It is now read-only.
/ elodin-old Public archive

Quality and Optimisation tools for CSS in JavaScript

License

Notifications You must be signed in to change notification settings

robinweser/elodin-old

Repository files navigation

Deprecated: This repository has been renamed and deprecated. There's something new coming soon that'll be named Elodin instead, but it provides similar benefits & ideas, just in a complete different way.

Elodin

Elodin is a plugin-based quality and optimization tool for CSS in JavaScript libraries.
It helps to write bulletproof and valid styles and pushes developer experience to a next level.

Elodin is built on top of Bredon which is a modern CSS value compiler.

TravisCI Test Coverage npm downloads npm version Gitter

Support Us

Support Robin Frischmann's work on Fela and its ecosystem (Elodin) directly via Patreon.

Or support us on Open Collective to fund community work. This also includes Elodin as well.
Thank you to all our backers!

Installation

yarn add elodin

You may alternatively use npm i --save elodin.

Features

  • Validation using bredon-validate
  • Most Plugins are fixable
  • Detailed Warnings

The gist

import elodin from 'elodin'
import validation from 'elodin-plugin-validation'
import longhand from 'elodin-plugin-longhand'

// create a preconfigured linter
const process = elodin({
  plugins: [
    longhand(),
    validation({
      removeInvalid: true
    })
  ],
  fix: true
})

const style = {
  padding: '20px 0 10px 5em',
  fontSize: '15pt',
  lineHeight: '1.2em',
  width: 'solid'
}

const warnings = process(style)

// using the fix option will automatically fix warnings
style === {
  paddingTop: '20px',
  paddingBottom: '10px',
  paddingLeft: '5em',
  fontSize: '15pt',
  lineHeight:  '1.2em'
}

Catching Warnings

If the fix option is disabled, Elodin will return a list of warning for every style object.

Taken the above example:

warnings.forEach(warning => console.log(warning.description))
// => The value "solid" is not valid in combination with "width".

Documentation

Coming soon.

Support

Got a question? Come and join us on Gitter!
We'd love to help out. We also highly appreciate any feedback.

Contributing

This project exists thanks to all the people who contribute.

We highly appreciate any contribution.
For more information follow the contribution guide.
Also, please read our code of conduct.

License

Elodin is licensed under the MIT License.
Documentation is licensed under Creative Common License.
Created with ♥ by @rofrischmann.