caddyserver / caddyserver/website

Insufficient contrast in docs

Open
#487 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
HTML
Stars
227
Forks
213
Avg merge
3h 52m
Merged PRs (30d)
1

Description

This might be a little different issue for once.

I who suffer from bad eyesight found the color scheme on the navigation bar in the docs very hard to read.
Obviously, this depends on a lot of factors, like screen colors, room lighting, viewing angle, eyesight... but it would probably be a very easy change.

The inactive font has the color #668d9b, the background is #060F18 resulting in a contrast of 5.37.
This meets the minimum of 4.5 per WCAG, but not the enhanced value of 7.0.

I would kindly suggest changing the font color to more light one, e.g. #A9BFC7 for a contrast of 10.0

Current colors: https://coolors.co/contrast-checker/668d9b-060f18
New colors: https://coolors.co/contrast-checker/a9bfc7-060f18

I also noticed the highlighter for the active element has bad contrast too (color #061b35), but I would consider changing it optional as its a relatively large element.

PS: This is about the dark mode variant.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Search the docs' dark-mode navigation styles for #668d9b and #060F18, then inspect the active-element color noted in the issue. Compare the inactive and active states against the stated WCAG targets; done means the inactive navigation text has improved contrast, with the active state addressed if included.

Written by the indexing model from the issue text.

Assessment

Tech stack
html
Domain
accessibility, documentation
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.