mui-toolpad
mui-toolpad copied to clipboard
mui
Expand theme editor
Decide on what kind of theming we will support and expand the theme editor to support that
Benchmarks
- https://docs.appsmith.com/core-concepts/designing-an-application/app-theming
- https://www.appsmith.com/blog/may-round-up-app-theming-new-copy-paste-experience-and-product-updates#block-0
- https://www.notion.so/mui-org/MUI-Theme-builder-62d796eebeea43078d188934d4acffa6
- https://www.notion.so/mui-org/MUI-Theme-generator-99fa649872f94c98b52214ee7fba67bd
I think we can start with page level theme support. We currently have very basic options, we can look into adding more variables like typography, palette, etc. This is the most basic form of theming I can think of. Wondering which one would be basic:
- the way appsmith does i.e, providing theme templates
- the way https://bareynol.github.io/mui-theme-creator/ does by providing a UI to configure
In the future, we can look into component level customizations, overrides, etc.
Also, according to this each page can be themed differently. Should we think of doing app level theming instead?
From Dillon:
It would be nice if you could define a ThemeProvider for each page of the toolpad app or maybe you can but I couldn't figure it out without getting undefined palette errors. So I have a hacked method for dynamically changing the theme of the whole page from the dominate colors in an image. I store the pallete at the bottom of the page inside a container with visibility off and then set the sx prop for all the other components on the page to inherit. I'm sure there can be a simpler way of doing this:
I guess we could add overrides for theme colors at the page level. I don't immediately see us overriding the dark/light mode on a per page basis at the moment.
I guess we could add overrides for theme colors at the page level.
Might be a low-hanging fruit in terms of effort/UX improvement