jsxstyle Interface

In jsxstyle Interface style information is applied as props to the "jsxtyle building-block" components.

See freestyler jsxstyle and Co Interfaces API.

Example

import jsxstyle, {Block} from 'freestyler';

const BaseButton = jsxstyle('button');

class Button extends Component {
  render () {
    return (
      <Block border='1px solid tomato'>
        <BaseButton
          background="red"
          borderRadius="5px"
          color="#fff"
        />
      </Block>
    );
  }
}

Other libraries that provide jsxstyle Interface

• glamorous
• jsxstyle

glamorous Example

import glamorous from "glamorous";

class Button extends Component {
  render () {
    return (
      <glamorous.Div border='1px solid tomato'>
        <glamorous.Button
          background="red"
          borderRadius="5px"
          color="#fff"
        />
      </glamorous.Div>
    );
  }
}