grommet-styles

    0.2.0 • Public • Published

    grommet-styles

    Independent styles from Grommet apps

    Install

    npm install grommet-styles

    or

    yarn add grommet-styles

    Usage

    import styled from 'styled-components';
    import { colorStyle, sizeStyle } from 'grommet-styles';
     
    const Box = styled.div`
      ${props => props.bg && colorStyle('background-color', props.bg, props.theme)}
      ${props => props.width && sizeStyle('width', props.width, props.theme)}
    `;
     
    const theme = {
      global: {
        colors: {
          test: 'white',
        },
        size: {
          small: '75px',
        },
      },
    };
     
    <Box bg="test" width="small" theme={theme}>
      Hello World
    </Box>;

    Run locally

    git clone https://github.com/grommet/grommet-styles.git
    npm install
    npm run storybook
    

    Try

    Check this codesandbox

    Keywords

    none

    Install

    npm i grommet-styles

    DownloadsWeekly Downloads

    23,534

    Version

    0.2.0

    License

    Apache-2.0

    Unpacked Size

    29.7 kB

    Total Files

    21

    Last publish

    Collaborators

    • alansouzati