uBlock Origin dark theme

[Thorin-Oakenpants]

discussion continued from gorhill/uBlock#3342

sample from @overdodactyl with a a couple of original colors pasted in

• red/green/ (and yellow I assume) seem way too dark. Nothing wrong with the original colors
• grey colors - obviously we can;t use grey anymore, but please do not use red if you are (it's a bit confusing to me if this is happening or not) - use shades of blue (use the same saturation/luminosity etc as red, just switch around the RGB values to get the two shades (light/dark)
• color blind version needs testing

[overdodactyl]

Thanks @Thorin-Oakenpants!

Appreciate the ideas! I was definitely a bit too hast getting a first draft up on the repo.

I agree the colors are too dark. I used a similar color, but neglected to account for the opacity in the original ones onto the white background.

Blue's a good idea to replace grey with (it's not in the screenshot, but I had a lighter grey that blended in a little too well)

Also neglected to look at color blind version...back to work!

[overdodactyl]

Here's a look with the same red and green colors and blue instead of grey:

[Thorin-Oakenpants]

but neglected to account for the opacity

That's what I originally suspected/said in the other comment, but I edited that post to just point to here. That all looks good. Don't forget that yellow one :)

PS: I just turned on color blind friendly and I have no idea (they're all too close for my eyes). I think you will want some help with that. There are PS filters for testing the three main types (I have one somewhere, so sing out if you need it). From ages ago all I remember is that blue-color-blindness is rare (1%) and only affects men (yay for them!), The main one is red-green. Maybe ask on reddit so you can pimp yourself again xD :)

[overdodactyl]

Got the yellow one covered :)

I'll play around with the color blind friendly version a bit, but you're probably right about needing help with that one. If I can't find the PS filters, I'll let you know, thanks! Nothing ever seems to be easy ¯_(ツ)_/¯

Haha and when in doubt, always turn to Reddit :P

[Thorin-Oakenpants]

Well TBH the PS filter I have from around 16 (sixteen!!) years ago (so may not work in your PS version) simply shows you what the colors would look like if you were X type of color blind. I used it more for changing the colors used, so no color-blind friendly option was needed. Here we just need to make sure the colors in the friendly version don't change (I think, since they lack red/green)

Just had a look around and I think I ditched that plugin in some purge years ago. We've come along way in 16 years .. there are online color simulators - http://www.color-blindness.com/coblis-color-blindness-simulator/

[Thorin-Oakenpants]

checkin' needed - did you cover the 6 colors in the mouseover in the cells (showing the three light ones below, if the mouse is hovered that 1/3rd cell bit becomes dark)

[overdodactyl]

Thanks for that website @Thorin-Oakenpants! Had a little too much fun just playing around with that and uploading different photos haha.

Since I'm using the same colors as uBO (when taking into account opacity), I think I should be able to just do the same thing for the color blind friendly version and not have to worry too much.

In the original version I posted I had not done the hover colors, but they are now taken care of as well :)

[Thorin-Oakenpants]

Excellent ... you may take the day off tomorrow :)

[Thorin-Oakenpants]

rather than add a new issue...
https://raw.githubusercontent.com/overdodactyl/ShadowFox/master/userContent-files/webextension-tweaks/decentraleyes.css

double ; at end of the last two element properties

[overdodactyl]

Good catch @Thorin-Oakenpants, thanks! All fixed :)

[Thorin-Oakenpants]

Hmmm .. so I thought I might darken a few things - I'm not using anything except some tweaks to my speed dial extension and a couple of chrome changes (removed context menu items etc)

to userContent I added the root item variables and then the uBo css contents, and I still don't get the original colors (eg as per pasted in the first pic). Is there some opacity setting that needs applying?

Edit: eg

  /* Darker Red */
  blah blah { background-color: #ab0000 !important;}
  /* Lighter Red */
  blah blah { background-color: #dda0a2 !important;}

The colors used in the original uBo are

/* bright red   - C00000
   light red    - DD9090
   bright green - 3CB43C
   light green  - 90D090
   light yellow - DDD090
   dark grey    - 8D8D8D -> translate to blue
   light grey   - D5D5D5 -> translate to blue
*/

So I swapped out the two red ones, but eg they still are show darkened - I assume by the backgriund underneath? PS: I also get the bottom right column items non darkened - it makes me scream!