Open cipherlogs opened 6 months ago
Hey @cipherlogs, thanks for opening up this issue and for the suggestion! It definitely resonates with me; I also have personally felt this need in many other projects I've worked on before, and it's quite common, I'd say, just given the fact you usually need beefier buttons, for example, on mobile than on desktop.
Given we're currently focused on the Material UI v6 development, we might take a while to return to iterating on this. In the meantime, I've added the "waiting for 👍" label to gauge further community interest! This could actually be something brought up to both Joy UI and Material UI — it'd be handy on both.
Summary
Take a look at this code snippet:
If you want to change the size prop on certain screen sizes with Material UI, you can use hooks:
Often it might be too complicated for a simple task. However, it helps us reuse the predefined settings in Material UI's design system. The size prop not only changes the font size but could also affects other properties like margin, padding, height, and width etc ...
With Joy UI, we have to redefine each property separately, which can lead to inconsistencies:
It would be better to stay within the design system and respect the predefined settings that were already set up.
One suggestion is to add support for props to handle breakpoint changes, similar to how
ButtonGroup
already supports this:This approach would allow you to write something like:
This way, we can easily change the size prop based on different screen sizes while still using the predefined settings in the design system.
Examples
No response
Motivation
No response
Search keywords: breakpoint