Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[POC] CSS Variables #28639

Closed
wants to merge 13 commits into from
Closed

[POC] CSS Variables #28639

wants to merge 13 commits into from

Conversation

siriwatknp
Copy link
Member

@siriwatknp siriwatknp commented Sep 27, 2021

DO NOT MERGE!

This PR demonstrate css vars implementation proposed in #27651

  • turn theme into css vars
  • support multiple themes
  • fix ssr flash issue

Flash issue solved by running script in the body before the <Main> application

  1. open https://deploy-preview-28639--material-ui.netlify.app/css-vars-flash/ and click switch theme (to other theme that is not light).
  2. Hard reload will see the flash (I added setTimeout to make it obvious)
  3. goto https://deploy-preview-28639--material-ui.netlify.app/css-vars-no-flash/ won't see flash (even the same setTimeout)

With css variables, the component does not rerender when theme change (only if the component use the same variable)

@mui-pr-bot
Copy link

mui-pr-bot commented Sep 27, 2021

No bundle size changes

Generated by 🚫 dangerJS against cbd4407

@siriwatknp siriwatknp mentioned this pull request Sep 27, 2021
16 tasks
@eps1lon eps1lon changed the title [POC] CSS Variables NOT FOR MERGE [POC] CSS Variables Sep 27, 2021
@eps1lon eps1lon added the on hold There is a blocker, we need to wait label Sep 27, 2021
@github-actions github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged label Oct 20, 2021
@mbrookes mbrookes changed the title NOT FOR MERGE [POC] CSS Variables [POC] CSS Variables Nov 12, 2021
@mbrookes mbrookes added the package: joy-ui Specific to @mui/joy label Nov 12, 2021
@siriwatknp
Copy link
Member Author

The idea has been proved, so this PR can be closed.

@siriwatknp siriwatknp closed this Nov 15, 2021
@danilo-leal danilo-leal added the proof of concept Studying and/or experimenting with a to be validated approach label Feb 7, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
on hold There is a blocker, we need to wait package: joy-ui Specific to @mui/joy PR: out-of-date The pull request has merge conflicts and can't be merged proof of concept Studying and/or experimenting with a to be validated approach
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants