Contrast issues - Githubissues

code4lib / 2021.code4lib.org

Website for Code4Lib 2021

https://2021.code4lib.org

4 stars 3 forks source link

Contrast issues #176

Closed yarnetsky closed 3 years ago

yarnetsky commented 3 years ago

[ ] The :focus indicator nearly disappears on the register and sponsor buttons.
[x] The text in the event cards (ie Awesome talks, Keynote) are very low contrast — 2.2:1 currently. We need to get to 4.5:1

jscaffrey commented 3 years ago

Hi @yarnetsky - Which browsers is this an issue for? And would you recommend we override the default browser styles to achieve that?

The file/code we'd be updating is https://github.com/code4lib/2021.code4lib.org/blob/main/assets/_scss/_mixins.scss

yarnetsky commented 3 years ago

Chrome and Safari. It's mostly an issue with dark backgrounds where there's barely enough contrast to see the :focus indicator. WCAG recommendation is for a light/dark indicator that shows up on every background. Unfortunately, I'm not familiar with mixins to translate this properly. This page has two example recommendations...

https://www.w3.org/WAI/WCAG21/Techniques/css/C40