@-ui/styles
npm i @-ui/styles
Quick Start
`
jsx harmony
// React example
import React from 'react'
import styles from '@-ui/styles'
styles.variables({ colors: { red: '#c12', blue: '#09a', purple: '#800080', }, })
const style = styles({
red: color: var(--colors-red);
,
blue: ({colors}) => `
color: ${colors.blue};
.${style('red')} {
color: ${colors.purple};
}
`, })
const Component = (props) => (
<div className={style({blue: props.blue, red: props.red})}>
Hello world
<span className={style(props.blue && 'blue', props.red && 'red')}>
Hello world
<span className={style('blue')}>I'm always blue
<span className={style('red')}>I'm purple when my parent is blue
)
`
API
Coming soon. Until then play with this React example on CodeSandbox
LICENSE
MIT