-
Notifications
You must be signed in to change notification settings - Fork 8
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
Full width Text input error state and margin/padding to match design #128
Comments
Adjusted some of the padding. However; the larger style changes going to hold off. As currently we piggy back off of standard form items and want to find a clean way to keep that. |
dabrad26
added a commit
that referenced
this issue
Nov 29, 2023
dabrad26
added a commit
that referenced
this issue
Nov 29, 2023
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
The full width Text input in the Gray 10 Theme Mobile carbon Figma file includes an underline and error icon below:
https://www.figma.com/file/O3KSDu2TWpMaazGkgsKqLA/(Beta)-Gray-10-Theme-Mobile---Carbon-Design-System?node-id=1880-6923&t=TO40aq4eUt9nqMHI-4
Using the
FormItem
type="text" component, it is possible to add style for the error state to include the underline and position the error message by passingcomponentProps.style
totextInputProps
. But since the error icon is within the input component the icon's position is out of sync with the design:Also, the bottom margin on the label should be 5px instead of 8:
And the bottom margin on the error message should be 20px instead of 8:
If there is another way to render this that we are not aware of please let us know.
The text was updated successfully, but these errors were encountered: