search

inezabonte / ineza.codes

This is my portfolio built using Astro, Tailwind CSS and MDX🚀
https://ineza.codes
0 stars 0 forks source link

Add contrast to footer text #171

Closed inezabonte closed 3 years ago

inezabonte commented 3 years ago

The text in the footer needs a bit more contrast

Screen Shot 2021-07-27 at 16 22 57
Ryuno-Ki commented 3 years ago

Indeed: https://coolors.co/contrast-checker/6b7280-111827 recommends #BFC3CA.

inezabonte commented 3 years ago

Any ideas on how I can solve this? @Ryuno-Ki

Screen Shot 2021-07-28 at 00 26 26
Ryuno-Ki commented 3 years ago

While aria-label works, it has some downsides. If I use automatic-translation as offered by some browsers, chances are it won't get covered.

Instead, a .sr-only helper class is a better choice: https://webaim.org/techniques/css/invisiblecontent/

inezabonte commented 3 years ago

Awesome, I'll use this approach