mirror of
https://github.com/idanoo/GoScrobble.git
synced 2024-11-24 09:25:15 +00:00
49 lines
698 B
Markdown
49 lines
698 B
Markdown
|
# @emotion/react
|
||
|
|
|
||
|
|
> Simple styling in React.
|
||
|
|
|
||
|
|
## Install
|
||
|
|
|
||
|
|
```bash
|
||
|
|
yarn add @emotion/react
|
||
|
|
```
|
||
|
|
|
||
|
|
## Usage
|
||
|
|
|
||
|
|
```jsx
|
||
|
|
/** @jsx jsx */
|
||
|
|
import { jsx, css, Global, ClassNames } from '@emotion/react'
|
||
|
|
|
||
|
|
render(
|
||
|
|
<div css={{ color: 'hotpink' }}>
|
||
|
|
<div
|
||
|
|
css={css`
|
||
|
|
color: green;
|
||
|
|
`}
|
||
|
|
/>
|
||
|
|
<Global
|
||
|
|
styles={{
|
||
|
|
body: {
|
||
|
|
margin: 0,
|
||
|
|
padding: 0
|
||
|
|
}
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
<ClassNames>
|
||
|
|
{({ css, cx }) => (
|
||
|
|
<div
|
||
|
|
className={cx(
|
||
|
|
'some-class',
|
||
|
|
css`
|
||
|
|
color: yellow;
|
||
|
|
`
|
||
|
|
)}
|
||
|
|
/>
|
||
|
|
)}
|
||
|
|
</ClassNames>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
```
|
||
|
|
|
||
|
|
More documentation is available at https://emotion.sh.
|