Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Conversation

@foxbunny
Copy link
Collaborator

Before

2025-10-13 08_50_39-Greenshot

After

2025-10-13 08_51_23-Greenshot

WCAG criteria

  • 1.4.3 Contrast (Minimum) (Level AA)

@ThiefMaster
Copy link
Member

Do we really need this strong dark border? For text I get it, but I don't think the border looks good... It's even more noticeable when you have a messagebox on the same page:

image

Also, the title and description text of such a box now looks exactly the same... shouldn't the latter use the secondary color? If this violates WCAG contrasts, maybe making the background of these boxes a bit lighter would be a good alternative?

(FWIW the border colors were slightly different before, but not as strongly)

@ThiefMaster ThiefMaster requested a review from marinaej October 13, 2025 13:18
@foxbunny
Copy link
Collaborator Author

foxbunny commented Oct 13, 2025

The border being the same as the main color is simply how it was before, I didn't change that. It doesn't have to be as pronounced as far as WCAG goes.

If by "look exactly the same" you mean they have exactly the same color, yes, that's the default text color in both cases. Technically you can make the title have secondary text color (dark grey) but then you get a wonky case where the title is lighter than the text but not colored, which I think is even weirder. Since the title is already bold, I think it has enough emphasis to not be mistaken as part of the text that follows.

As for just making the background lighter, that won't really help that much. Most of the colors would be too light even on a white background.

Copy link
Contributor

@marinaej marinaej left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This makes sense to me. When it comes to contrasting with other boxes, I personally don't think this will be a problem from a UX standpoint.
A middle ground would be to have the border of the box lighter than than what it currently is, to differentiate more with the other components, but it's not absolutely necessary imho.

Copy link
Contributor

@marinaej marinaej left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@AjobK and I just noticed the colors added in the variables file. Some of the hex codes are the same as pre-existing variables from the palette, some of them are not, could you please tell us how they were generated / calculated?

@foxbunny
Copy link
Collaborator Author

@marinaej Since I cannot reply to your comments directly for some reason, I'll comment here. The blue in particular was aligned with the theme color. For other colors, I used the existing colors as the starting point and used the contrast calculation in the dev tools to calculate the optimal contrast. The scheme was then adjusted roughly to be consistent in terms of lightness and overall contrast.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants