Dashboard chart separates significant from non-significant bars by red/green alone
Maintainers usually reply within 1 day
Nobody has claimed this yet.
Assessment
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Newbie friendliness
- 45/100
- Issue type
- Feature
- Clarity
- Mostly clear
- Activity status
- Active
- Tech stack
- css, javascript, python
- Domain
- accessibility, frontend
Research direction
Start with chartModel() and chartToSvg() in assets/benchmark-dashboard.js to see how bad and good bars get their fill, then the .bar-fill.bad and .bar-fill.good rules in assets/benchmark.css for the on-screen version. Pick one non-colour cue (a hatch pattern or a value-label marker) and apply it in both the screen and SVG/PNG export paths, then add a colour-blind-safe option to the "Export colours" select. Done when the chart-theme assertions in tests/test_benchmark_dashboard.py pass and bad bars are distinguishable without colour.
Written by the indexing model from the issue text.
Description
Where: assets/benchmark.css (.bar-fill.bad / .bar-fill.good), assets/benchmark-dashboard.js chartModel() / chartToSvg().
Current gap: the dashboard chart (on screen and in the SVG/PNG export) separates significant from non-significant results by colour alone: --accent (#a63a22, red) versus --accent3 (#2f6b4f, green). Those two are close for people with red-green colour blindness, and there is no second cue (pattern, label or marker), which fails WCAG 1.4.1 (use of colour). #813 made the export colours selectable but all four options keep the same red/green pairing.
Repro: open the dashboard, pick a fairness metric and attribute, and view the chart under a deuteranopia simulation: significant and non-significant bars are hard to tell apart.
Suggested approach: add a non-colour cue to bad bars (diagonal hatch via an SVG <pattern> in the export and a CSS gradient on screen, or a leading marker in the value label), and offer a colour-blind-safe pair (blue/orange) in the "Export colours" select as an additional option. Add assertions to the chart-theme test in tests/test_benchmark_dashboard.py.
- Dominant language
- HTML
- Stars
- 47
- Forks
- 45
- Avg merge
- 3h 10m
- Merged PRs (30d)
- 78
Getting set up
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from yakew7/Fair-Code
-
enhancement good first issue
Difficulty 2/5 1-3 hours Newbie friendliness 86/100
Maintainers usually reply within 1 day
-
enhancement good first issue
Difficulty 2/5 1-3 hours Newbie friendliness 84/100
Maintainers usually reply within 1 day
-
enhancement good first issue
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
Maintainers usually reply within 1 day
-
documentation good first issue
Difficulty 2/5 1-3 hours Newbie friendliness 79/100
Maintainers usually reply within 1 day
-
documentation help wanted
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
Maintainers usually reply within 1 day
All issues in yakew7/Fair-Code
Similar issues
-
bug mobile
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
lognorman20/monaco#6265 ·
-
bug
Difficulty 2/5 1-3 hours Newbie friendliness 70/100
deltachat/deltachat-desktop#6881 · 1 comment ·
Maintainers usually reply within 3 days
-
area: client bug
Difficulty 2/5 1-3 hours Newbie friendliness 66/100
Maintainers usually reply within 1 day
-
comp/dashboard P2 tool/file type/bug
Difficulty 2/5 1-3 hours Newbie friendliness 76/100
NousResearch/hermes-agent#142836 · 1 comment ·
-
accessibility area:ui size:S
Difficulty 2/5 1-3 hours Newbie friendliness 84/100
EmanuelAngel/pomody#197 ·
Maintainers usually reply within 1 day