search

umbraco / Umbraco.UI

Umbraco UI Components
MIT License
117 stars 39 forks source link

uui-swatch: checkmark has too low contrast on light colors #653

Open bjarnef opened 10 months ago

bjarnef commented 10 months ago

Which exact UI Library version are you using? For example: 1.0.1 - don't just write v1.

1.6.0-rc

Bug summary

It seems https://github.com/umbraco/Umbraco.UI/pull/649 changed the uui-swatch so checkmark doesn't has sufficient contrast on light background colors, e.g. on yellow background the checkmark used to be black: https://uui.umbraco.com/?path=/story/uui-color-swatches--overview

image

image

That's why it had the isLight() function and set the color-swatch--light CSS class.

Specifics

No response

Steps to reproduce

Select light colors in uui-swatches or uui-swatch and notice checkmark is always white.

Expected result / actual result

No response

markadrake commented 3 months ago
image

@bjarnef I believe this issue can be closed.

bjarnef commented 3 months ago

While it has changes for yellow, it seems to have low contrast for other colors.

image

which should show this instead:

image

markadrake commented 3 months ago

@bjarnef what page of the UUI site are you using for your screenshot?

Brown looks good:

image

There are some questionable ones, for example:

image

Perhaps overlaying a check isn't the right, or "most accessible" solution anyways.