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

Accessibility: improve button contrast #419

Open
biou opened this issue Jul 19, 2020 · 5 comments
Open

Accessibility: improve button contrast #419

biou opened this issue Jul 19, 2020 · 5 comments

Comments

@biou
Copy link
Contributor

biou commented Jul 19, 2020

I just checked the contrast of the grey button with the three white dots, and currently the contrast between this grey and white is of 1.3:1. It would be better if we could have a contrast of 3:1.
This tool can help in finding more contrasted colors: Tanaguru contrast finder

@goblindegook
Copy link
Owner

Hi @biou, I just pushed an overhaul of the styles for littlefoot, including a colour scheme change. I'm trying to keep a neutral scheme that would look reasonably decent by default on a variety of designs. If you could have a look at the code (in the master branch), that'd be appreciated. Thanks!

@biou
Copy link
Contributor Author

biou commented Oct 28, 2020 via email

@biou
Copy link
Contributor Author

biou commented Oct 30, 2020

For the default button, the contrasts are ok. When you display the number of the footnote by customising the buttonTemplate, then the contrast is not sufficient. For a small text, the contrast of the text on the background should be at least 4.5:1 (see https://www.w3.org/TR/WCAG21/#contrast-minimum ) But you provide an alternative through the title attribute, so for me what you propose here is ok.

@goblindegook
Copy link
Owner

Good catch, I'll darken the button a bit.

@AlainVagner
Copy link

Just one proposal to improve the contrasts a bit with the current version:

    --button-active-background-color: #3f3f3f;
    --button-text-color: #fff;

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants