fix(components): [DSYS-139] improve dark mode Alert warning colors#1910
Conversation
Shift dark mode warning border, background, and icon fill toward yellow/gold so warning is distinguishable from error. Co-authored-by: Cursor <cursoragent@cursor.com>
🦋 Changeset detectedLatest commit: 832835c The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
commit: |
cmwinters
changed the title
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes using default effort and found 2 potential issues.
❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, have a team admin enable autofix in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit 5d5a8cb. Configure here.
| --alert-color-bg-success: var(--lp-color-green-0); | ||
| --alert-color-border-warning: #fad88f; | ||
| --alert-color-bg-warning: #fdfae4; | ||
| --alert-color-icon-warning: var(--lp-color-brand-orange-base); |
There was a problem hiding this comment.
Light mode warning icon color unintentionally changed
Medium Severity
The warning icon fill changed from #e65d00 (dark burnt orange, rgb(230, 93, 0)) to var(--lp-color-brand-orange-base) (rgb(255, 157, 41), a much lighter golden orange) in both light and dark mode. The PR intends to fix only dark mode colors, and the test plan item "Confirm light mode warning appearance is unchanged" is explicitly unchecked. The light-mode --alert-color-icon-warning definition could use the original #e65d00 (or an equivalent token) to preserve light-mode appearance, while only the dark-mode block uses the new value.
Additional Locations (1)
Reviewed by Cursor Bugbot for commit 5d5a8cb. Configure here.
There was a problem hiding this comment.
I think this is fine, it looks better:
| --alert-color-bg-success: var(--lp-color-green-0); | ||
| --alert-color-border-warning: #fad88f; | ||
| --alert-color-bg-warning: #fdfae4; | ||
| --alert-color-icon-warning: var(--lp-color-brand-orange-base); |
There was a problem hiding this comment.
Primitive token used instead of semantic alias for icon
Low Severity
--alert-color-icon-warning uses the primitive token var(--lp-color-brand-orange-base), while the other alert icon variants use semantic aliases (--lp-color-fill-feedback-error, --lp-color-fill-feedback-info, --lp-color-fill-feedback-success). No --lp-color-fill-feedback-warning semantic alias exists in packages/tokens. Primitives carry no intent and bypass theming — the right fix per the design token rules is to add the missing alias in the tokens package and reference it here.
Additional Locations (1)
Triggered by project rule: Bugbot Instructions — launchpad-ui
Reviewed by Cursor Bugbot for commit 5d5a8cb. Configure here.
There was a problem hiding this comment.
This is just a local fix for the Alert component. Will follow up to add a global --lp-color-fill-feedback-warning token per https://launchdarkly.atlassian.net/browse/DSYS-148?atlOrigin=eyJpIjoiMmIwMWViNTRjYWVlNDM2NGFkOGQ5OWViZTU1NTU3YTUiLCJwIjoiaiJ9
Screenshots are hosted directly on the PR description instead. Co-authored-by: Cursor <cursoragent@cursor.com>
2 participants
Summary
#946020) and background (#34260e) to read yellow/gold instead of red-orange, making warning clearly distinguishable from error.--alert-color-icon-warningtoken usingbrand-orange-base.Screenshots
Block/Tones story in dark mode (
Components/Status/Alert → Block/Tones):Test plan
Made with Cursor
Note
Low Risk
CSS-only Alert token updates with no behavior or API changes.
Overview
Dark mode Alert warning styling is retuned so it reads more yellow/gold and is easier to tell apart from error: border and background tokens move from red-orange hues to
#946020/#34260e.Warning icon fill no longer uses a hardcoded hex; it uses a new
--alert-color-icon-warningtoken (brand-orange-base) in default and dark themes. Light-mode warning surface colors are unchanged aside from sharing the icon token.Reviewed by Cursor Bugbot for commit 832835c. Bugbot is set up for automated code reviews on this repo. Configure here.