Styled-components and react-bootstrap?

Question

Is there a way to use styled-components together with react-bootstrap? react-bootstrap exposes bsClassproperties instead of className for their compone

Answer 1

You can extend the style keeping the original styles of the component from bootstrap. You will find more documentation on using third party libraries like react bootstrap with styled-components here.

const StyledButton = styled(Button)`
  color: palevioletred;
  font-size: 1em;
  margin: 1em;
  padding: 0.25em 1em;
  border: 2px solid palevioletred;
  border-radius: 3px;
`;

Here is a sandbox for reference: https://codesandbox.io/s/2vpm40qk90