Code block color choices could be improved for accessibility
@aqualls discovered that our code blocks cause contrast warnings when you check with the WAVE accessibility plugin.
I did some digging, and we can modify all the colors here: https://gitlab.com/gitlab-org/gitlab-docs/-/blob/master/content/assets/stylesheets/highlight.scss
-
For example, with me choosing colors at random for testing (LEFT = Before, RIGHT = After):
-
I also found this collection of themes: https://maxchadwick.xyz/pygments-high-contrast-stylesheets/
Applying the Monokai theme from there gives us:
But, I'm not a fan of how it colors
yaml
codeblocks:
If we can find a good theme (using the Pygments template style), it should be trivial to update.
Edited by Marcel Amirault