influxdata / influxdata/docs-v2
a11y: Link and copyright text colors fail WCAG AA contrast on light theme
- Dominant language
- JavaScript
- Stars
- 82
- Forks
- 326
- Avg merge
- 1d 1h
- Merged PRs (30d)
- 82
Description
## Problem
A Lighthouse 13.2.0 / axe-core 4.11.4 audit of https://docs.influxdata.com/influxdb3/enterprise/ (2026-07-20) flagged `color-contrast` failures (severity: serious; WCAG 2.1 AA 1.4.3 requires 4.5:1 for normal text). This is a brand-palette decision, so it was split out from the mechanical a11y fixes on branch `claude/influxdb-docs-lighthouse-chphcn`.
## Lighthouse/axe findings (light theme)
1. **Links in the Support and feedback block** — foreground `#00a3ff` on background `#f7f8f9`, ratio **2.57** (needs 4.5:1), font 16.8px normal weight.
- Failing elements: `contact InfluxData Support` (`https://support.influxdata.com/`) and `trial@influxdata.com` in `layouts/partials/article/feedback.html`. The same link blue is used site-wide in article text, so any in-article link at normal weight likely fails too.
2. **Copyright footer** — foreground `#7b7fa1` on background `#f3f4fb`, ratio **3.55** (needs 4.5:1), font 14.4px normal weight.
- Failing element: `div.copyright` ("© 2026 InfluxData, Inc.").
## Proposed fix
- Darken the light-theme link color (e.g., a `#00a3ff` → darker blue that reaches ≥4.5:1 on `#f7f8f9`, roughly `#0072b8` or darker) or increase font weight/underline treatment per design guidance. Theme variables live in `assets/styles/themes/_theme-light.scss`.
- Darken the copyright text color to reach ≥4.5:1 on `#f3f4fb` (e.g., `#5c608a` or darker).
- Re-check the dark theme after changes; the audit only exercised the light theme.
## Reproduce
Run Lighthouse (Accessibility category) or axe DevTools against the URL above in the light theme and inspect the `color-contrast` audit. Accessibility scored **72** at audit time; the other failing audits (button-name, link-name, list, landmark-one-main, heading-order, accesskeys, meta-viewport) are already fixed on `claude/influxdb-docs-lighthouse-chphcn`.
Contributor guide
No contributing guide indexed for this repository
Research direction
Start with assets/styles/themes/_theme-light.scss to identify the light-theme link and copyright color variables, then inspect layouts/partials/article/feedback.html and the footer element with class div.copyright. Run Lighthouse or axe against the documented Enterprise URL in both themes; done means the light-theme text reaches at least 4.5:1 without introducing dark-theme failures.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- scss
- Domain
- accessibility, documentation
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Quiet
- Clarity
- Clearly specified
- Newbie friendliness
- 78/100