[darkmastermindz]

Summary

CI's a11y spec (from #243) fails on every open PR, and would fail on main too, with one rule on /projects:

color-contrast: .is-on > .chip__count: #aaaaaa on #653496, 3.63:1 (needs 4.5:1)

The count inside the selected filter chip ("All 12") was grey on the purple chip. Its colour is now light purple #e9d5ff, which gives 6.21:1. This sandbox has no network, so /projects has no repos locally, and the problem only showed in CI, which has real data.

Related Issue

Follow-up to #243 (accessibility). It's the failure on #230 and #248: Android touch shards 1/4 and 3/4.

Changes Made

• pages/projects.vue: .chip.is-on .chip__count { color: #e9d5ff }, with a comment giving the ratio.
• Unselected chips keep #aaa, which is 6.82:1 on the page background, so they were already fine.
• The tag chips' selected state (black on green) isn't affected.

How to Test

• npm test: 253 pass. npm run generate: OK.
• On the built site, Pixel 7, /projects:
  • the selected chip's count computes to rgb(233, 213, 255) on rgb(101, 52, 150);
  • axe with the WCAG 2.1 A/AA tags finds no violations.
• tests/e2e/a11y.spec.mjs on Pixel 7 and Galaxy Tab S9 landscape: 28 passed.
• Ratios were computed with the WCAG formula: #aaa on #653496 is 3.64 (CI measured 3.63), and #e9d5ff on #653496 is 6.21.
• CI on this PR, with real repos, is the definitive check: Android touch shards 1–4.

Additional Notes

• The same commit is cherry-picked into Phones/tablets: social links open a new tab that closes itself if an app takes over #230 and Chrome and Android foldable fixes for the foldable layouts #248 so their CI goes green. It no-ops there once this merges.

---

Generated by Claude Code