Align headers and typography in the theme #1627
Conversation
oliviertassinari
requested a deployment
to
md-headers - toolpad-db PR #1627
Render
Abandoned
oliviertassinari
temporarily deployed
to
md-headers - toolpad PR #1627
Render
Destroyed
|
Curious about the values used for H1, H2, etc. Seems different than the expectation to use the Material typographic scale. |
To me, the Material typographic scale doesn't feel dense enough for the use-cases we intend Toolpad for. I tried to align a bit to what the MUI docs do. Happy to revert to the defaults. I'm not quite sure yet how we ideally should handle this. |
oliviertassinari
requested a deployment
to
md-headers - toolpad-db PR #1627
Render
Abandoned
oliviertassinari
temporarily deployed
to
md-headers - toolpad PR #1627
Render
Destroyed
|
Looks good to me and I agree that Material typography scale is not ideal for Toolpad use cases. Retool and appsmith also seem to have a smaller scale. Q) Now that H1 is bold, if I want to use that size but not the bold variant, is there anyway I can do it through sx? I searched for it but couldn't find. |
@prakhargupta1 it can be done on a case by case basis like so https://toolpad-pr-1627.onrender.com/_toolpad/app/cldvok57d0001ql9utit3cf7t/pages/ev03mab
@gerdadesign If you agree and feel like playing around with a new scale, denser, for Toolpad specifically, I'd be happy to include your suggestions. If you think we should maintain the Material design scale I'm also happy to revert. We can also bring it up for discussion next meeting. |
|
Merging this, we can always tweak later |
Fixes #1612
The approach here was to teach the markdown element about the typography styles of the theme. Then define the headers sizes in the theme. That way the theme is the single source of truth for bot the Markdown and the Text components.
before:
after:
This also removes the margins for first and last headers. Anyone with better eye for design, feel free to suggest changes. @gerdadesign ?