Skip to content

Move the floating theme toggle into the navigation bar #1301

Description

@brylie

The theme toggle floats over the top-right of the header and sticky navigation. On small screens it can cover content or a focused element (WCAG 2.2 criteria 2.4.11 and 2.5.8). Move it into the navigation bar so it no longer overlaps anything.

Grounding: docs/accessibility-audit-2026-09.md, "Remaining recommendations (not fixed in code)", item 4

Acceptance criteria:

  • The toggle sits inside the navigation bar, at desktop and mobile widths
  • It never covers focused content when tabbing through the page
  • Its target is at least 24 by 24 CSS pixels
  • It still works with keyboard and screen reader, and keeps the saved preference
  • Checked at 320px and 1280px, in light and dark themes

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    UX ReviewEnsure features work correctly and have good UXenhancementNew feature or requestgood first issueGood for newcomershacktoberfestIssues selected for Hacktoberfesthelp wantedExtra attention is needed

    Type

    No type

    Projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions