1.1.0 • Published 8 years ago
react-stylerify v1.1.0
React stylerify
npm install react-stylerify
browserify -t react-stylerify -o build.js main.js
React stylerify is a browserify wrapper around react-styling, that allow to import style from external file through require('mystyle.radium');
or require('mystyle.css');
or require('mystyle.style');
.
Working example
This project uses Radium together with React Template.
Usage
<Button kind="primary">Radium Button</Button>
var Radium = require('radium');
var React = require('react');
var styles = require('style.radium')();
// alternately
//var styles = require('style.css')();
//var styles = require('style.style')();
@Radium
class Button extends React.Component {
static propTypes = {
kind: React.PropTypes.oneOf(['primary', 'warning']).isRequired
};
render() {
return (
<button
style={[
styles.base,
styles[this.props.kind]
]}>
{this.props.children}
</button>
);
}
}
/* style.radium */
base: {
color: '#fff';
:hover{
background: #0074d9;
}
}
primary: {
background: #0074D9;
}
warning: {
background: #FF4136;
}