Cheat Sheets

styled components

Created: 2019 December 11th

Updated: 2019 December 11th

Edit this page on GitHub

conditionally use a style

React icon
<StyledButton
active={true}
onClick={this.handleButton}
></StyledButton>

And in your styles something like this:

React icon
const StyledButton = styled.button`
align-items: center;
line-height: 0.2;
${({ active }) =>
active &&
`
background: blue;
`}
`