I’m having trouble reading the color-coded blue text on dark background, like the var keyword on line 17 of the solution here:
Could we do something to increase the contrast ratio?
The text color of --tertiary-high is #036299
The background is --secondary #313146
That yields only 1.93:1, which is a long way from 3:1 for large text or 4.5:1 for regular text. I’m happy to help if I can. Can you tell I’ve just finished the basic CSS course?
I was going to suggest you try the dark theme but the contrast on that is even worse
There is actually an issue about this on github (#38947) but it hasn’t gotten any traction in a while. One of the suggestions is to allow users to completely disable colored syntax highlighting, which I think is a very good idea. But yes, the colors being used definitely need to have more contrast.
Are you at a point where you feel you could do this?
P.S. As a temporary workaround, if you are able, you can install the Stylus browser extension and use that to override the default styling for this (based on the class given this element). I just tried it and it works great. This is of course not a proper long term solution but Stylus has helped me quite a bit over the years with issues like this.
I am contributing small changes, so far mostly to verbiage. I could probably manage changing the colors up a bit, but wouldn’t be able to implement the feature to disable syntax highlighting.