[FormHelperText][material-next] Add FormHelperText component #39503
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
mj12albert
added
component: text field
Netlify deploy previewhttps://deploy-preview-39503--material-ui.netlify.app/ @mui/material-next: parsed: +0.39% , gzip: +0.15% Bundle size reportDetails of bundle changes (Toolpad) |
This was referenced Oct 19, 2023
mj12albert
force-pushed
the
material-next/form-helper-text
branch
3 times, most recently
from
e4f8b35
to
9477ae5
Compare
mj12albert
force-pushed
the
material-next/form-helper-text
branch
2 times, most recently
from
e78c767
to
9c1add0
Compare
This comment was marked as outdated.
This comment was marked as outdated.
mj12albert
force-pushed
the
material-next/form-helper-text
branch
2 times, most recently
from
f36b5b9
to
e6c8d1d
Compare
mj12albert
force-pushed
the
material-next/form-helper-text
branch
5 times, most recently
from
78a7807
to
9949e22
Compare
mj12albert
force-pushed
the
material-next/form-helper-text
branch
from
9949e22
to
b21b3f5
Compare
mj12albert
force-pushed
the
material-next/form-helper-text
branch
from
6e93751
to
33828b4
Compare
mj12albert
commented
Nov 10, 2023
| @@ -67,7 +67,7 @@ export const FormLabelRoot = styled('label', { | |||
| }, | |||
| [`&.${formLabelClasses.disabled}`]: { | |||
| color: | |||
| 'color-mix(in srgb, var(--md-comp-form-label-disabled-color), transparent calc(var(--md-comp-form-label-disabled-opacity) * 100%))', | |||
| 'color-mix(in srgb, var(--md-comp-form-label-disabled-color) calc(var(--md-comp-form-label-disabled-opacity) * 100%), transparent)', | |||
There was a problem hiding this comment.
The % was on the wrong color from before but it was hard to see until now 😅
mnajdova
reviewed
Nov 21, 2023
Comment on lines
82
to
83
| marginLeft: 14, | ||
| marginRight: 14, |
There was a problem hiding this comment.
14 is an off number to end up with considering the spacing, is this based on the spec?
There was a problem hiding this comment.
The Figma file uses 16px on both sides:
However, if we change this, we must ensure that all labels are aligned:
There was a problem hiding this comment.
👍 I've realigned everything 5f9105d
(this is actually off in v5 as well, the MD2 spec also specifies 16px padding)
mnajdova
approved these changes
Nov 21, 2023
|
Looks good! ✨ While reviewing, noticed that the 
|
mnajdova
pushed a commit
to mnajdova/material-ui
that referenced
this pull request
Nov 30, 2023
mnajdova
pushed a commit
to mnajdova/material-ui
that referenced
this pull request
Dec 1, 2023
mnajdova
pushed a commit
to mnajdova/material-ui
that referenced
this pull request
Dec 1, 2023
mnajdova
pushed a commit
to mnajdova/material-ui
that referenced
this pull request
Dec 6, 2023
mnajdova
pushed a commit
to mnajdova/material-ui
that referenced
this pull request
Dec 6, 2023
mnajdova
pushed a commit
to mnajdova/material-ui
that referenced
this pull request
Dec 6, 2023
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Continues #38374
Closes #39513
This PR adds
FormHelperTextto material-next, I've updated the/experimentspage again but also copied it to a sandbox 👇 for easier review ~Demo: https://codesandbox.io/s/https-github-com-mui-material-ui-pull-39503-5f4k8n?file=/src/App.tsx
Preview:
material-next-form-helper-text.mov