Cheat Sheets

styled components

Created: 2019 December 11th

Updated: 2019 December 11th

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;
  `}
`