Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Custom HTML block: line numbers lack sufficient contrast #8736

Closed
sarahmonster opened this issue Aug 8, 2018 · 4 comments
Closed

Custom HTML block: line numbers lack sufficient contrast #8736

sarahmonster opened this issue Aug 8, 2018 · 4 comments
Labels
[Feature] Blocks Overall functionality of blocks [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes).

Comments

@sarahmonster
Copy link
Member

Line numbers may not be considered critical to the user experience, but with the current shade of grey, they don't have sufficient contrast with the white background:

screenshot 2018-08-08 23 56 28

The color combination #999999/#ffffff has a contrast ratio of 2.85, which is not sufficient. At this size, you will need a ratio of at least 4.5.

screenshot 2018-08-08 23 55 20

@sarahmonster sarahmonster added [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Feature] Blocks Overall functionality of blocks labels Aug 8, 2018
@earnjam
Copy link
Contributor

earnjam commented Aug 9, 2018

Looks like this is due to CodeMirror's default styles. FWIW, it's a problem with core's implementation of Custom CSS as well.
image

Using #666 solves it in both places, so we should probably fix in core as well while we're tackling it.

@earnjam
Copy link
Contributor

earnjam commented Aug 9, 2018

Created a core ticket for this: https://core.trac.wordpress.org/ticket/44763

@abdullah1908
Copy link
Contributor

@earnjam patch updated on core track regarding this fix 👍
https://core.trac.wordpress.org/ticket/44763#comment:4

@nerrad
Copy link
Contributor

nerrad commented Jun 2, 2019

It doesn't look like the html block uses code mirror anymore (and there are no line numbers so I'm going to close this.

@nerrad nerrad closed this as completed Jun 2, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Blocks Overall functionality of blocks [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes).
Projects
None yet
Development

No branches or pull requests

4 participants