changedetection.io icon indicating copy to clipboard operation
changedetection.io copied to clipboard

Errors color in dark mode has bad contrast

Open igorsantos07 opened this issue 1 year ago • 2 comments

Describe the bug Dark mode should use pinkish colors for the error tone. This is specially bad against the lighter gray.

The disabled icons are hard to distinguish as well.

Version Exact version in the top right area: 0.46.01

To Reproduce

Steps to reproduce the behavior:

  1. create an errorable check, like https://changedetection.io/share/g-bqxqaqsQga
  2. change to dark mode
  3. squint to read

Screenshots image image

Desktop (please complete the following information):

  • OS: Linux
  • Browser Vivaldi
  • Version 6.8.3381.46

Additional context I highly recommend usage of https://webaim.org/resources/contrastchecker/ :)

igorsantos07 avatar Jul 23 '24 17:07 igorsantos07

Apple's HIG Colors are a great resource since they have specific color sets for light and dark mode that maximize contrast in UI.

bwees avatar Jul 29 '24 16:07 bwees

The colors for darkmode and light-mode are defined here https://github.com/dgtlmoon/changedetection.io/blob/master/changedetectionio/static/styles/scss/parts/_variables.scss if someone would want to make a PR (according to @bwees HIG colors) , probably this smaller task i wont get around to

dgtlmoon avatar Jul 30 '24 07:07 dgtlmoon