Problem
Pathogen::Link styles inline navigation with raw neutral-* and primary-* utilities. Hover and text colours do not use --pvc-color-accent, and focus still uses black/white outlines.
Links appear throughout copy-heavy clinical screens, so they should match the same accent and focus rules as Button.
What we will build
Links that use semantic text and accent tokens plus --pvc-color-focus for keyboard focus.
How we will build it
- Update
app/components/pathogen/link.rb LINK_CLASSES.
- Default text:
--pvc-color-text or the nearest strong text role.
- Hover/accent:
--pvc-color-accent / --pvc-color-accent-strong.
- Focus:
focus-visible:outline-[var(--pvc-color-focus)].
- Radius: prefer
--pvc-radius-action if the focus shape needs a tokenized radius.
- Check link previews and tooltip pairing still work.
Testing
Not in scope
- Button-styled links (
Pathogen::Button with tag: :a stays separate).
- Typography inside links.
- Broad Lookbook preview cleanup.
Done when
Link matches the Foundations guidance for accent application and focus, with no hard-coded black/white outlines.
Depends on: #88
Design docs: docs/lookbook/design_system/01-design-contract.md.erb (Links, Focus And Keyboard)
Problem
Pathogen::Linkstyles inline navigation with rawneutral-*andprimary-*utilities. Hover and text colours do not use--pvc-color-accent, and focus still uses black/white outlines.Links appear throughout copy-heavy clinical screens, so they should match the same accent and focus rules as Button.
What we will build
Links that use semantic text and accent tokens plus
--pvc-color-focusfor keyboard focus.How we will build it
app/components/pathogen/link.rbLINK_CLASSES.--pvc-color-textor the nearest strong text role.--pvc-color-accent/--pvc-color-accent-strong.focus-visible:outline-[var(--pvc-color-focus)].--pvc-radius-actionif the focus shape needs a tokenized radius.Testing
aria-labelbehaviour unchanged.pnpm run build:css:checkpasses if class generation changes the CSS artifact.Not in scope
Pathogen::Buttonwithtag: :astays separate).Done when
Link matches the Foundations guidance for accent application and focus, with no hard-coded black/white outlines.
Depends on: #88
Design docs:
docs/lookbook/design_system/01-design-contract.md.erb(Links, Focus And Keyboard)