codenames icon indicating copy to clipboard operation
codenames copied to clipboard

improve readability of dark mode

Open CWempe opened this issue 3 years ago • 1 comments

When I was playing with my family everybode was pleased when I mentioned there was a dark mode.

But everybody switched back to light mode, because it was to hard to read.

I may try to see what colors work better and add a PR when I find some time.

I will look at https://material.io/design/color/dark-theme.html for inspiration. 😎

CWempe avatar Nov 26 '20 15:11 CWempe

Looks like it is not as easy to manipulate the colors as I expected. I just know a little html and css. But I cannot find where the color of the text is defined. Here? But I don't know how this works. 😄

Anyway: Here is my proposal (according to material design):

original:

image

proposal:

  1. main backgroud: #121212
  2. cell background: #fff; opacity: 16% (or similar)
  3. text color: #fff; opacity: 87%;

image

My main issue is the contrast of the cell background to the cell text. It should be more "white on back" instead of "black on grey"

CWempe avatar Nov 26 '20 22:11 CWempe