Maybe you have plans to create a video about the initial style when starting a new project with material UI v5. As a backend dev, I'm interested to use only Material Ui from the start without any CSS files. I think it will use create them to add all those primary, secondary colours, all those margin 0 for the body ant etc.
Hi, I have a question that I can't seem to figure out and maybe you can help? How to get the height of the Mui v5 dialog component within useEffect. I'm new to both React and Mui. Thanks for your time - I'm a new subscriber.
Hey, At my job, I inherited a large-ish CRA monolith that used MUI-v4, however, the dev that started the app (~1.5 yrs ago) and barely leveraged the theme for the design system at all, only really adding a bunch of colors to the pallette. Now, I have a feature branch cooking with the upgrade to MUI-v5, and I really want to lean into augmenting components in the theme components api as much as possible. I'd be really interested in hearing your take in a video on how you'd balance between augmenting in the theme vs. sx props vs. what you'd do a component level (i.e. wrapping a MUI component)? For example, if you were tasked with implementing a design system (say, you're given a figma with a desired look of all the stock components).
Hi Brian, thanks for the comment. The distinction MUI makes between sx and styled components is fairly superficial. Supposedly you would use styled components when you plan on exporting the component and using it throughout your app...but you can do the same thing with a component styled using sx. Both of these options work fine for creating a component once and then using it throughout the app. Between the two, in my opinion it comes down to the syntax you prefer. I think the best option for styling a large app is to override the component at the theme level. I linked to a relevant article below. This is likely the least verbose and it is probably the 'intended' MUI method for app-wide styling. smartdevpreneur.com/the-ultimate-guide-to-the-material-ui-theme-object-breakpoints-overrides-shadows-typography-and-more/
Hi I am kinda new to mui5, when there is a overflow problem in the modal and I gave overflow auto to the main div of modal, it overrides the body's overflow:hidden property, I mean I want to scroll in modal but not in the background, I want to disable background scrolling when modal is open, how can I do it, do you have any idea?