Issue #647
emotion
can be used in framework agnostic or with React. To use with React, follow https://emotion.sh/docs/introduction#react
npm i @emotion/core
Note that you must have /** @jsx jsx */
at the top of the file, and the unused jsx
in import is a directive for JSX to work properly
// this comment tells babel to convert jsx to calls to a function called jsx instead of React.createElement
/** @jsx jsx */
import { css, jsx } from '@emotion/core'
const color = 'white'
render(
<div
css={css`
padding: 32px;
background-color: hotpink;
font-size: 24px;
border-radius: 4px;
&:hover {
color: ${color};
}
`}
>
Hover to change color.
</div>
)