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

[Bug]: Visual styling issues with AILabel, revet and error states in form fields #18116

Open
7 tasks
alisonjoseph opened this issue Nov 19, 2024 · 0 comments
Open
7 tasks
Labels
package: @carbon/react @carbon/react package: styles @carbon/styles severity: 2 https://ibm.biz/carbon-severity type: bug 🐛

Comments

@alisonjoseph
Copy link
Member

alisonjoseph commented Nov 19, 2024

There are various visual bugs when combining props for the form components below. We need to be sure to look at all variations of the following props. The updated decorator prop adds a wrapping div that wasn't present with the slug prop so can cause some styling differences.

  • slug
    • with AILabel
    • with AILabel with revert set to true
  • decorator
    • with AILabel
    • with AILabel with revert set to true
  • warn
  • invalid

Components

  • NumberInput - spacing off for error icon with AILabel & with revert true
  • FluidNumberInput - Extra divider
  • TextArea - Error/Warn icon overlaps AI Revert
  • MultiSelect- missing divider with error + decorator
  • FilterableMultiSelect - missing divider with error + decorator
  • ComboBox- missing divider with error + decorator
  • Dropdown- missing divider with error + decorator

@alisonjoseph alisonjoseph moved this to ⏱ Backlog in Design System Nov 19, 2024
@alisonjoseph alisonjoseph added severity: 2 https://ibm.biz/carbon-severity package: @carbon/react @carbon/react package: styles @carbon/styles labels Nov 19, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: @carbon/react @carbon/react package: styles @carbon/styles severity: 2 https://ibm.biz/carbon-severity type: bug 🐛
Projects
Status: ⏱ Backlog
Development

No branches or pull requests

1 participant