Style react admin with bootstrap

Question

I have a React Admin application set up, and it's functioning correctly with the default styles. Now, I want to use Bootstrap to enhance the UI. sx doesn't help a lot, I want to style the inner components react admin provides (like buttons and inputs in forms), is there a simpler way to do this instead of forking react admin and breaking down the source code to add bootstrap in it which will take a lot of time.

I tried sx solution, i have no control over the smaller subcomponents

Answer 1

Actually, i asked this question before reading the docs with focus.

• sx enables you to style inner components, get the inner component classname from the docs or vis the dev tools and style it, read the docs from here Themeing
• React admin is build using material ui, trying to use bootstrap makes no sense since both provides these ready to use component (e.g. component)
• If you really want it to look 'bootstrapy', you can override the default component styles, but no support for inheriting bootstrap classes, you will fine tune the style to look like bootstrap (there are an example in the material ui docs where it trys to write a bootstrapy text input field here) (and don't do it, material ui default styles are good enough and both provides the ready to use components as mentioned

To learn more an material ui customization here

Bouns tip : Before learning any technology, start studying the technologies which are building it e.g. before react -> learn material ui (if you want to style it) before trpc -> take a look at react query No matter how docs are good, there will be gaps, the more you dive deep the more learning new technologies build on old stuff becomes easier