Using styled-components

@Kikketer wrote:

We use styled-components for our application and I was wondering if anyone has used this to style up any parts of Ionic.

We allow customers to alter the theme of our application using the theme features of styled-compoents as well, the theme itself is pulled from the network and applied to the components.

Basically what I’m trying to do is something like this:

const StyledToolbar = styled(IonToolbar)`
  --background: ${props => theme.toolbarColor};
`

Theming docs for styled-components: https://www.styled-components.com/docs/advanced#theming
Docs for Toolbar: https://ionicframework.com/docs/api/toolbar

Currently my toolbar appears white for some reason. I’d like to be able to customize that background color at runtime by providing an override. Styled-Components basically makes a separate styles tag in the document and gives the component a new classname.

Has anyone had any luck with this?

Posts: 1

Participants: 1

Read full topic