Skip to content

fix(docs): render --link-hover on light-mode callout-link hover#3693

Merged
dgageot merged 1 commit into
mainfrom
docs/callout-hover-light
Jul 16, 2026
Merged

fix(docs): render --link-hover on light-mode callout-link hover#3693
dgageot merged 1 commit into
mainfrom
docs/callout-hover-light

Conversation

@aheritier

Copy link
Copy Markdown
Contributor

What changed

Small follow-up to PR #3691's review: a non-blocking, should-fix
cosmetic CSS issue in docs/css/style.css.

In light mode, hovering a callout link (inside a warning/info/tip
admonition) never switched to --link-hover (#1A4DD9) as
docs/STYLE.md documents — it silently stayed --accent (#2560FF).

The light-mode default override
([data-theme="light"] .content .callout a:not(.btn)) has the exact
same specificity as the shared .content .callout a:not(.btn):hover
rule, but sits after it in source order, so it won on :hover too.
This mirrors the dark-mode shadowing bug already fixed in PR #3691
that fix added an explicit dark-scoped :hover rule, but the same
gap existed for light and was missed.

Not an accessibility failure: --accent on hover still cleared AA on
all three callout backgrounds (4.60–4.83:1). Purely a
behavior/documentation mismatch.

Fix: add [data-theme="light"] .content .callout a:not(.btn):hover { color: var(--link-hover); } right after the light default, same
pattern as the existing dark-mode rule. Scoped to callout links only —
non-callout prose links, .btn links, and dark-mode behavior are
untouched.

docs/STYLE.md updated (the callout-link bullet + contrast table) so
the doc matches the fixed cascade.

Verification

  • Computed styles via Puppeteer/system Chrome against a local Hugo
    build (features/tui/, which exercises all three callout variants):
    • Light: default rgb(37,96,255) (--accent) →
      hover rgb(26,77,217) (--link-hover, #1A4DD9) ✅
    • Dark: default/hover both rgb(191,206,255) (--blue-200, dark's
      --link-hover value) — unchanged from before this fix ✅
    • Non-callout prose link and .hero-buttons .btn: hover behavior
      unchanged in both themes ✅
  • New light-mode hover contrast ratios (blue-600 #1A4DD9 is darker
    than blue-500, so contrast only improves): 6.52:1 warning, 6.21:1
    info, 6.42:1 tip — all comfortably above AA's 4.5:1.
  • Local Hugo (v0.164.0) + [email protected] (system Chrome via
    PUPPETEER_EXECUTABLE_PATH; Docker was unresponsive in this
    sandbox) against the full static 12-URL set (both themes):
    12/12 passed, 0 errors.
  • npx markdownlint-cli2 STYLE.md — 0 errors.

actionlint wasn't run — no workflow files were touched.

Refs: PR #3691 (review follow-up).

The light-mode default override for callout links
([data-theme="light"] .content .callout a:not(.btn)) has the same
specificity as the shared hover rule but sits after it in source
order, so it silently won on hover too — light-mode callout links
stayed --accent (#2560FF) on hover instead of switching to
--link-hover (#1A4DD9) as STYLE.md documents. Not an AA failure
(--accent already passes on every callout background), just a
behavioral mismatch with the intended hover token.

Add an explicit [data-theme="light"] ... :hover rule after the light
default, mirroring the dark-mode fix already in place. Verified new
hover ratios: 6.52:1 warning, 6.21:1 info, 6.42:1 tip (all above the
previous --accent hover values, since blue-600 is darker than
blue-500) — dark-mode hover and non-callout/.btn links are untouched.

Follow-up from the review of PR #3691.
@aheritier
aheritier requested a review from a team as a code owner July 16, 2026 17:19
@dgageot
dgageot merged commit 15b99c9 into main Jul 16, 2026
20 checks passed
@dgageot
dgageot deleted the docs/callout-hover-light branch July 16, 2026 17:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants