A simple way to include CSS with React Components.
- Emotion, under the hood.
- Write plain ol' CSS. Period.
- Pre-processing when you need it. Powered by Stylis.
- Integrate with ease into your existing setup. No fiddling with Webpack required.
- iFrame support, out-of-the-box!
- Theming support!
- Scoping, to integrate into older (more hostile) CSS systems.
npm install --save @helpscout/fancy
Here's a quick example of how you can compose regular CSS with your React components.
import React from 'react'
import styled from '@helpscout/fancy'
const Button = props => {
const { children, styles, ...rest } = props
<button className={styles.Button} {...rest}>
{children}
</button>
}
export default styled(Button)`
background: white;
border: 1px solid #eee;
`View the docs to get started with Fancy!
Many thanks to the folks who built Emotion and Styled Components.