CODEWITHSUNDEEP
reactjsmaterial-ui
bharath bhushan
bharath bhushan

Reputation: 217

Styling Material ui React components

I am currently working on these material ui react components and need to customize these components, so I choose this way of styling the component as you can see below

.MuiStepIcon-root.MuiStepIcon-completed {
  color: "green"
}

In my app.scss file.

enter image description here

I know that there is withStyles using which I have to style my components, as the Ux is complex I find couldn't customize my component using withStyles and I found it difficult to do I that way.

So, Is it ok to customize the component directly using the class names, if no, why? Please provide me with some help.

Upvotes: 0

Views: 230

Answers (1)

William Rizzi
William Rizzi

Reputation: 603

It's fine to costumize the components from material-ui using className. Something that you should keep in mind is that changing a component style with their className(className that material-ui puts in the component) will change all others component's that have the same className. With that in mind you should try use something to prevent that from happen.

You could pass your className to the component and then use it as the target on css or you can use some css rules that prevent those things, one good example is https://rscss.io/

Upvotes: 1

Related Questions