fix(site): keep standard avatar border for normal AI spend state - #28037
Open
tracyjohnsonux wants to merge 4 commits into
Open
fix(site): keep standard avatar border for normal AI spend state#28037tracyjohnsonux wants to merge 4 commits into
tracyjohnsonux wants to merge 4 commits into
Conversation
The user dropdown avatar previously received a grey border override whenever spend data was present, even in the normal state. Keep the default avatar border for normal spend and only change the border for warning/exceeded states, using a thicker 2px border so the change is perceivable without relying on color alone.
Elevated spend states now show a corner badge with a warning icon and an accessible label/tooltip, so the state change does not rely on the border color alone.
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
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.
The navbar avatar received a grey
border-content-secondaryoverride whenever AI spend data was present, so the default (normal spend) state looked different from a standard avatar. It also relied entirely on border color to communicate state, which is easy to miss and inaccessible to colorblind users.Changes
Avatarborder.border-2in the warning/destructive color, so the state change is perceivable by thickness as well as color.Storybook:
AvatarBorderNormal/Warning/Exceededstories now assert indicator presence/absence, and Chromatic snapshots cover the visual states.This PR was generated by Coder Agents on behalf of @tracyjohnsonux.