search

Quansight / Quansight-website

💻 Source code for Quansight Labs website
https://labs.quansight.org
21 stars 50 forks source link

[BUG] - Code block syntax highlighting has inaccessible color contrast #319

Open gabalafou opened 2 years ago

gabalafou commented 2 years ago

What site is this for?

Quansight Labs

Expected behavior

No response

Actual behavior

Currently, when running the Deque Chrome Dev Tools Axe audit on a blog page with code blocks, it reports contrast issues in the syntax highlighting.

How to Reproduce the problem?

No response

Anything else?

No response

trallard commented 2 years ago

We are currently using CodeHike for syntax highlighting

From their configuration docs: https://codehike.org/docs/configuration it uses shiki so we should be able to change the theme. I do not know which one would meet wcag standards (see list https://codehike.org/docs/configuration#theme-list). Some of which might meet standards:

Else their docs say we can use VSCode themes https://codehike.org/docs/configuration#custom-themes

But - my guess is many themes will fail on contrast

trallard commented 2 years ago

Also - if we're making changes to the config can we add line numbers and a copy-paste button?