-
-
Notifications
You must be signed in to change notification settings - Fork 32.5k
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
[docs] More explicit breakpoint documentation in sx
#26140
Conversation
The `unstable_styleFunctionSx` utility adds the support for the `sx` to your own components. Normally you would use the `Box` components from `@material-ui/core` at the root of your component tree. If you would like to use the system independently from Material-UI, this utility will give you the same capabilities, while having a smaller bundle size. | ||
The `unstable_styleFunctionSx` utility adds the support for the [`sx` prop](/system/basics/#the-sx-prop) to your own components. | ||
Normally you would use the `Box` component from `@material-ui/core` at the root of your component tree. | ||
If you would like to use the system independently from Material-UI, the `unstable_styleFunctionSx` utility will give you the same capabilities, while having a smaller bundle size. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The "this" refernce was more than one sentence away. I noticed that I had to stop reading to understand what this
is referring to (I wasn't sure if "this" referred to Box
or unstable_styleFunctionSx
even though unstable_styleFunctionSx
is implied by "this utility".
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good.
For the up behavior, we had #25846 to ask for a way to configure a down one
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
👍
Which is relevant for |
Helps review
sx
does whenever it is mentionedThis helps discovery if algolia decides to display a mention of
sx
as the first resultthis
mention (https://developers.google.com/tech-writing/one/words#this_and_that)this
can work if the reference is obvious. That's not always obvious though and may even change over time if sentences move farther apart.sx={{ lg: {} }}
matchesbreakpoints comparison was mentioned in the paragraph earlier in a code comment so easy to miss if you already know
sx
but not how breakpoints work.See my struggle in [Hidden] Remove component #26135 (comment)