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

[system][docs] Add "dynamic values" section to sx prop page #42239

Merged

Conversation

aarongarciah
Copy link
Member

@aarongarciah aarongarciah commented May 14, 2024

Resolves #42164

Adds a new "Dynamic values" section in the sx prop docs page with guidance on how to leverage CSS variables to handle highly dynamic values to avoid polluting the DOM with unnecessary style tags.

This PR will be cherry-picked to master.

Preview link: https://deploy-preview-42239--material-ui.netlify.app/system/getting-started/the-sx-prop/#dynamic-values

@aarongarciah aarongarciah added docs Improvements or additions to the documentation package: system Specific to @mui/system labels May 14, 2024
@aarongarciah aarongarciah force-pushed the aarongarcia/sx-prop-inline-css-vars branch from 45cba1c to 5bbf2e7 Compare May 14, 2024 16:18
@aarongarciah aarongarciah changed the title Include dynamic values with sx prop guidance [system][docs] Add "dynamic values" section to sx prop May 14, 2024
@aarongarciah aarongarciah marked this pull request as ready for review May 14, 2024 16:20
@aarongarciah aarongarciah changed the title [system][docs] Add "dynamic values" section to sx prop [system][docs] Add "dynamic values" section to sx prop page May 14, 2024
@mui-bot
Copy link

mui-bot commented May 14, 2024

Netlify deploy preview

Bundle size report

No bundle size changes (Toolpad)
No bundle size changes

Generated by 🚫 dangerJS against 065f566

@aarongarciah aarongarciah force-pushed the aarongarcia/sx-prop-inline-css-vars branch from 5bbf2e7 to cd47d08 Compare May 14, 2024 16:23
@aarongarciah aarongarciah force-pushed the aarongarcia/sx-prop-inline-css-vars branch from 48a251e to 6c061ad Compare May 14, 2024 19:05
@aarongarciah aarongarciah force-pushed the aarongarcia/sx-prop-inline-css-vars branch from 6c061ad to 99da7e3 Compare May 14, 2024 21:04
@aarongarciah
Copy link
Member Author

aarongarciah commented May 14, 2024

A visual regression test is failing but it's unrelated and it's also failing in other PRs e.g. #42236

edit: this is resolved now

@aarongarciah aarongarciah added the needs cherry-pick The PR should be cherry-picked to master after merge label May 15, 2024
Copy link
Member

@mnajdova mnajdova left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The demo looks good, I will ask for Sam's review in ragards to the copy-writing

Copy link
Contributor

@brijeshb42 brijeshb42 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for adding.

@aarongarciah aarongarciah force-pushed the aarongarcia/sx-prop-inline-css-vars branch from e9effa7 to 6b3fe3e Compare May 29, 2024 09:25
@aarongarciah aarongarciah enabled auto-merge (squash) May 30, 2024 16:23
@aarongarciah aarongarciah merged commit e03c08c into mui:next May 30, 2024
19 checks passed
@aarongarciah aarongarciah deleted the aarongarcia/sx-prop-inline-css-vars branch May 30, 2024 16:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
docs Improvements or additions to the documentation needs cherry-pick The PR should be cherry-picked to master after merge package: system Specific to @mui/system
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[docs] Improving the sx prop documentation
5 participants