classnamed-components

Make react components with functional CSS

Usage no npm install needed!

<script type="module">
  import classnamedComponents from 'https://cdn.skypack.dev/classnamed-components';
</script>

README

classnamed-components

Make react components with functional CSS

NPM JavaScript Style Guide

Install

npm install classnamed-components

Usage

import * as React from 'react'
import { classnamed } from 'classnamed-components'

const MyButton = classnamed('button')`
  btn shadow
  ${props => ({
    big: 'btn-lg',
    small: 'btn-sm',
  }[props.size])}
`
const MySection = classNamed("section")`px-6 py-4 bg-white`;

const MyExample = (props) => (
  <MySection/>
    <MyButton size="big" />
    <MyButton size="small" className="ml-2" />
  <MySection/>
)

License

MIT © Hermanya