Wondering what’s next for npm?Check out our public roadmap! »

    This package has been deprecated

    Author message:

    This package has moved to @dash-ui/styles

    @-ui/styles
    TypeScript icon, indicating that this package has built-in type declarations

    1.2.4 • Public • Published

    @-ui/styles

    Bundlephobia Types Code coverage Build status NPM Version MIT License

    npm i @-ui/styles

    Quick Start

    // 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>
        <span className={style('blue')}>I'm always blue</span>
        <span className={style('red')}>I'm purple when my parent is blue</span>
      </div>
    )

    API

    Coming soon. Until then play with this React example on CodeSandbox

    LICENSE

    MIT

    Install

    npm i @-ui/styles

    DownloadsWeekly Downloads

    16

    Version

    1.2.4

    License

    MIT

    Unpacked Size

    218 kB

    Total Files

    38

    Last publish

    Collaborators

    • avatar