fix: add consistent visible focus for interactive components (a11y) - backport v19#8381
Open
Wagner3UB wants to merge 3 commits into
Open
fix: add consistent visible focus for interactive components (a11y) - backport v19#8381Wagner3UB wants to merge 3 commits into
Wagner3UB wants to merge 3 commits into
Conversation
Documentation build overview
106 files changed ·
|
stevepiercy
reviewed
Jul 13, 2026
stevepiercy
left a comment
Member
There was a problem hiding this comment.
One question. Otherwise LGTM. Thank you!
stevepiercy
approved these changes
Jul 14, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Backport of #7850 to the 18.x.x branch.
Centralizes focus-state management to ensure visual consistency and resolve accessibility (a11y) issues with missing visible focus on interactive components. Focus indicators appear only during keyboard navigation via
:focus-visible.Changes
extras/focus.less(new): adds the.universal-focus-style()mixin (single source of truth for focus indicators) and global:focus-visiblerules — applied to interactive elements, inputs, Semantic UI checkboxes and skiplinks. Contenteditable/slate editors are excluded (text cursor already implies focus).extras/main.less: importsfocus.less.extras/skiplinks.less: removes the localborder/outlineon:focus(now centralized).globals/site.variables: adds@innerFocusShadow(#fff) and@outerFocusOutline(#000) for the dual-ring high-contrast strategy.Notes for review
.skiplinks-wrapper a:focus-visible(v19 PR used.skiplinks a, which does not match the DOM).2px solidinstead of the v19 PR'sauto, for a crisp, consistent width across browsers.