Freestyler

5th generation CSS-in-JS library

Project README

Consider using nano-css instead. It is smaller, tested and actively maintained.

libreact logo

freestyler

5th generation React styling library — it is lightning fast, lean, and with gazillion features.

        Yeah, straight from the top of my dome
            As I rock, rock, rock, rock, rock the microphone
                Yeah, straight from the top of my dome
                    As I rock, rock, rock, rock, rock the microphone...

feat.

Typing and autocompletion

CSS Templates

Reference

Installation

npm i freestyler --save

Usage

import {
    css,
    styled,
    rule,
    StyleSheet,
    Component,
    hoc,
    jsxstyle
} from 'freestyler';

import hyperstyle from 'freestyler/lib/react/hyperstyle';
import {styleit, Styleit} from 'freestyler/lib/react/styleit';

Decorate stateful components.

@css({
    border: '1px solid tomato',
})
class App extends Component {
    render () {
        return <div>Hello world!</div>;
    }
}

Or, create "styled" stateless components.

const Bordered = styled.div({
    border: '1px solid tomato',
});
const App = () =>
    <Bordered>Hello world!</Bordered>;

License

Unlicense — public domain.


Are you a freestyler?
Open Source Agenda is not affiliated with "Freestyler" Project. README Source: streamich/freestyler
Stars
248
Open Issues
14
Last Commit
6 days ago