[object Object]

← back to Thesetdecorator

TSD a11y: add keyboard focus-visible ring to games page

2201e362f153bf0194f2c414985dca47f7d272b2 · 2026-06-03 07:58:14 -0700 · SteveStudio2

css/games.css had 0 focus styles (main.css has them) — keyboard users got no
visible focus on game buttons/choices/cards. Added :focus-visible neon outline
for .btn-neon/.btn-ghost/.choice/.card/.back + a/button fallback. Mouse clicks
stay clean (:focus-visible only).
yolo audit item #2 · local only, no deploy.

Files touched

Diff

commit 2201e362f153bf0194f2c414985dca47f7d272b2
Author: SteveStudio2 <steve@designerwallcoverings.com>
Date:   Wed Jun 3 07:58:14 2026 -0700

    TSD a11y: add keyboard focus-visible ring to games page
    
    css/games.css had 0 focus styles (main.css has them) — keyboard users got no
    visible focus on game buttons/choices/cards. Added :focus-visible neon outline
    for .btn-neon/.btn-ghost/.choice/.card/.back + a/button fallback. Mouse clicks
    stay clean (:focus-visible only).
    yolo audit item #2 · local only, no deploy.
---
 public/css/games.css | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/public/css/games.css b/public/css/games.css
index 4f823fe..18c04e3 100644
--- a/public/css/games.css
+++ b/public/css/games.css
@@ -125,6 +125,20 @@ a { color: var(--wwhl-neon-2); }
 .row.center { justify-content:center; }
 small { color: var(--wwhl-text-dim); }
 
+/* Keyboard focus — visible focus ring for a11y (was missing entirely).
+   Mouse clicks stay clean via :focus-visible; keyboard/tab shows the neon ring. */
+.btn-neon:focus-visible,
+.btn-ghost:focus-visible,
+.choice:focus-visible,
+.card:focus-visible,
+.games-header .back:focus-visible,
+a:focus-visible,
+button:focus-visible {
+  outline: 2px solid var(--wwhl-neon-2);
+  outline-offset: 2px;
+  border-radius: 6px;
+}
+
 /* Responsive */
 @media (max-width:640px) {
   .games-main { padding: 1rem; }

← ad4d3ff TSD a11y/SEO: one <h1> per page (demote secondary H1s to h2)  ·  back to Thesetdecorator  ·  backlog: mark audit items #1-3 done (h1, games focus, lazy-l 05c9188 →