Skip to content

fix(apollo-vertex): raise status colour contrast to WCAG AA - #1391

Merged
ruudandriessen merged 1 commit into
mainfrom
fix/vertex-status-contrast
Nov 13, 2026
Merged

ruudandriessen merged 1 commit into
mainfrom
fix/vertex-status-contrast

Conversation

@ruudandriessen

Copy link
Copy Markdown
Collaborator

What

lintapple 0.1.20 flagged light-mode status colours below WCAG AA (4.5:1 for small text) on the badge, alert, confidence-signal, sonner and feature-flags previews. Dark mode passed.

This darkens the light-mode --success, --info and --badge tokens in registry.json (theme and per-item cssVars). Hue and chroma stay the same and lightness drops by the smallest step that passes every flagged pair. Dark tokens are unchanged.

Token Before After
--success oklch(0.57 0.105 152) #418958 oklch(0.50 0.105 152) #2b7444
--info oklch(0.52 0.120 210) #007a8f oklch(0.47 0.120 210) #006b80
--badge oklch(0.5995 0.0199 253.42) #78818c oklch(0.565 0.0199 253.42) #6e7782

Two findings came from hard-coded colours in docs examples, not from tokens:

  • Alert "Show all" link used text-[oklch(0.60_0.125_210)] (#0093a9). It now uses text-info.
  • Feature-flags demo used text-green-600 (#00a63e) on bg-green-50. It now uses text-green-700, which matches the title above it.

The docs token tables (foundation-tokens.ts, notifications guideline) are updated to the new values.

Contrast (light mode)

Tints are composited in sRGB over the backgrounds lintapple reported (#f5f5f5) and over white.

Pair Before After
badge success default: #fff on --success 4.25 5.71
success text on #f5f5f5 (secondary badge, confidence-signal, sonner) 3.90 5.23
success text on success/10 over #f5f5f5 (secondary badge) 3.48 4.58
success text on success/10 over #fff 3.78 4.97
badge info default: #fff on --info 5.02 6.15
info text on info/15 over #f5f5f5 (secondary badge) 3.77 4.54
info text on info/15 over #fff 4.08 4.92
badge neutral default / feature-flags: #fff on --badge 3.95 4.55
feature-flags text on green-50 3.07 4.72
alert info link on #fff 3.65 6.15
sonner success toast: dark text on success 25% + card 14.09 13.39

The "before" numbers match the lintapple report to within rounding.

Impact check

I grepped text-/bg-/border- usages of success, info and badge in packages/apollo-vertex/registry and apps/apollo-vertex. Users include button (bg-success/bg-info with white text, contrast improves), timeline marker, solution-tests, ai-chat check icons, confidence-signal levels and alert borders/tints. All are light-mode text or fill on light surfaces, so darkening keeps or improves contrast. Dark mode values are not touched. No apollo-core tokens are involved.

Note: light --info no longer equals light --primary (oklch(0.52 0.120 210)). Primary is unchanged here because it was not part of the finding.

Verification

  • Ratios computed with a small script (OKLCH to sRGB, WCAG relative luminance, sRGB alpha compositing for /10, /15 and color-mix tints).
  • pnpm generate:theme emits the new light values. Dark values are unchanged.
  • packages/apollo-vertex: pnpm lint (oxlint type-aware), pnpm typecheck, pnpm format:check, vitest run all pass.
  • apps/apollo-vertex: pnpm lint, pnpm typecheck pass.
  • I did not re-run lintapple against a deployed preview.

@ruudandriessen
ruudandriessen requested a review from a team as a code owner October 16, 2026 11:44
@ruudandriessen
ruudandriessen requested review from 0xr3ngar and angeloaltamiranom and a balanced review from Copilot October 16, 2026 11:44
@github-actions github-actions Bot added the size:M 30-99 changed lines. label Oct 16, 2026
@github-actions
github-actions Bot temporarily deployed to preview/apollo-design October 16, 2026 11:45 Destroyed
@github-actions
github-actions Bot temporarily deployed to preview/apollo-vertex October 16, 2026 11:45 Destroyed
@github-actions
github-actions Bot temporarily deployed to preview/apollo-docs October 16, 2026 11:45 Destroyed
@github-actions
github-actions Bot temporarily deployed to preview/apollo-landing October 16, 2026 11:45 Destroyed

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟢 Approval recommended

Contrast checks and token consistency checks support the targeted changes, with no blocking issues identified.

0 open findings

What changed in this PR

Improves Apollo Vertex’s light-mode status colour contrast to meet WCAG AA for small text.

Changes:

  • Darkens success, info and badge tokens without changing dark-mode tokens.
  • Updates two documentation examples to use higher-contrast text colours.
  • Synchronizes token reference documentation.
File Description
packages/​apollo-vertex/​registry.json Updates theme and per-component light-mode tokens.
apps/​apollo-vertex/​lib/​foundation-tokens.ts Synchronizes documented token values.
apps/​apollo-vertex/​content/​docs/​guidelines/​notifications/​notification-examples.tsx Uses the info token for the expandable alert link.
apps/​apollo-vertex/​content/​docs/​guidelines/​notifications/​in-product.mdx Updates notification colour references.
apps/​apollo-vertex/​content/​docs/​components/​feature-flag-demo.tsx Darkens light-mode demo text.

🧠 Review effort: Balanced


💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

@github-actions

github-actions Bot commented Oct 16, 2026 •

Copy link
Copy Markdown
Contributor

Dependency License Review

  • ✅ 1958 package(s) scanned
  • ✅ No license issues found
  • ⚠️ 2 package(s) excluded (see details below)
License distribution
License Packages
MIT 1722
ISC 91
Apache-2.0 57
BSD-3-Clause 28
BSD-2-Clause 23
BlueOak-1.0.0 8
MPL-2.0 4
CC0-1.0 4
MIT-0 3
MIT OR Apache-2.0 2
(MIT OR Apache-2.0) 2
Unlicense 2
LGPL-3.0-or-later 1
Python-2.0 1
CC-BY-4.0 1
(MPL-2.0 OR Apache-2.0) 1
Unknown 1
Artistic-2.0 1
(WTFPL OR MIT) 1
(BSD-2-Clause OR MIT OR Apache-2.0) 1
CC-BY-3.0 1
0BSD 1
(MIT OR CC0-1.0) 1
MIT AND ISC 1
Excluded packages
Package Version License Reason
@img/sharp-libvips-linux-x64 1.3.4 LGPL-3.0-or-later LGPL pre-built binary, not linked
khroma 2.1.0 Unknown MIT per GitHub repo, missing license field in package.json

@github-actions

github-actions Bot commented Oct 16, 2026 •

Copy link
Copy Markdown
Contributor

📊 Coverage + size by package

Per-package bundle size on this PR (no JS/TS source changes detected under packages/* or web-packages/*).

Package Coverage New-line coverage Packed (gzip) Unpacked vs main
@uipath/apollo-core — — — — —
@uipath/apollo-react — — — — —
@uipath/apollo-ui-icons — — — — —
@uipath/apollo-vertex 92.6% — 350.1 KB 1.98 MB +1 B
@uipath/apollo-wind — — — — —
@uipath/ap-chat — — — — —

"Coverage" is each package's own coverage.include scope (e.g. apollo-core instruments only scripts/). "Packed"/"Unpacked" come from npm pack --dry-run and only cover built packages — "—" means not measured this run (package not affected / not built). "vs main" is the packed (gzipped) delta against the last successful main build (the package-sizes artifact from the Release workflow); "—" there means no main baseline was available this run. The baseline is main's latest build, not this PR's exact merge-base, so it includes any drift since the branch diverged. Packages with no vitest config are omitted.

@ruudandriessen
ruudandriessen marked this pull request as draft October 16, 2026 11:50
@github-actions

github-actions Bot commented Oct 16, 2026 •

Copy link
Copy Markdown
Contributor

Storybook visual diff

✅ No stories are affected by this PR's changes; nothing to compare. Logs

Updated (PT): Nov 13, 2026, 06:13:57 AM

@github-actions

github-actions Bot commented Nov 2, 2026

Copy link
Copy Markdown
Contributor

This PR has been stale for over 2 weeks with no new commits. Closing — feel free to reopen if you'd like to continue this work. To keep a PR exempt from this automation, add the do-not-close label.

@github-actions github-actions Bot closed this Nov 2, 2026
@ruudandriessen
ruudandriessen marked this pull request as ready for review November 13, 2026 14:03
lintapple flagged light-mode status text below 4.5:1 in badge, alert,
confidence-signal, sonner and feature-flags. Darken the light --success,
--info and --badge tokens just enough that every flagged pair passes, and
replace two hard-coded docs colours with accessible ones. Dark mode tokens
are unchanged.

- --success: oklch(0.57 0.105 152) -> oklch(0.50 0.105 152)
- --info: oklch(0.52 0.120 210) -> oklch(0.47 0.120 210)
- --badge: oklch(0.5995 0.0199 253.42) -> oklch(0.565 0.0199 253.42)
- alert example link: text-[oklch(0.60_0.125_210)] -> text-info
- feature-flags demo: text-green-600 -> text-green-700
@ruudandriessen
ruudandriessen force-pushed the fix/vertex-status-contrast branch from f111993 to 5179487 Compare November 13, 2026 14:04
Copilot AI balanced review requested due to automatic review settings November 13, 2026 14:04
@github-actions
github-actions Bot temporarily deployed to preview/apollo-design November 13, 2026 14:05 Destroyed
@github-actions
github-actions Bot temporarily deployed to preview/apollo-docs November 13, 2026 14:05 Destroyed
@github-actions
github-actions Bot temporarily deployed to preview/apollo-vertex November 13, 2026 14:05 Destroyed
@github-actions
github-actions Bot temporarily deployed to preview/apollo-landing November 13, 2026 14:05 Destroyed

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟡 Changes recommended

The theme customizer still initializes and resets from the old low-contrast success and info colors, so exported default themes do not match the corrected registry.

1 open issue

Review effort: Balanced

Comment thread packages/apollo-vertex/registry.json Resolved
@ruudandriessen
ruudandriessen enabled auto-merge (rebase) November 13, 2026 14:09
@ruudandriessen
ruudandriessen merged commit a174e70 into main Nov 13, 2026
47 of 48 checks passed
@ruudandriessen
ruudandriessen deleted the fix/vertex-status-contrast branch November 13, 2026 14:14

This branch was successfully deployed

No deployments
preview/apollo-landing — 51794877 Deployed Nov 13, 2026 by github-actions[bot]
preview/apollo-docs — 51794877 Deployed Nov 13, 2026 by github-actions[bot]
preview/apollo-vertex — 51794877 Deployed Nov 13, 2026 by github-actions[bot]
preview/apollo-design — 51794877 Deployed Nov 13, 2026 by github-actions[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

app:apollo-vertex size:M 30-99 changed lines.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants