Most Material-UI components have a CSS API that is specific to the component. This means that instead of having to assign a class name to the className property for every component that you need to customize, you can target specific aspects of the component that you want to change. Material-UI has laid the foundation for scoping component styles; you just need to leverage the APIs.
Scoped component styles
How to do it...
Let's say that you have the following style customizations that you want to apply to the Button components used throughout your application:
- Every button needs a margin by default.
- Every button that uses the contained variant should have additional top and bottom padding.
- Every button that uses the contained...
