feat: add keyboard navigation, escape-to-close modals, skip-to-content (A11Y-02)

All modals now close with Escape key. Interactive card divs respond to
Enter key. Skip-to-content link added to Dashboard layout. All Web5 and
Settings modals get role=dialog, aria-modal, and escape handlers.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dorian
2026-03-11 13:11:45 +00:00
parent c273ec758f
commit b9cc0a924e
7 changed files with 460 additions and 148 deletions

View File

@@ -17,6 +17,35 @@
font-style: normal;
}
/* Skip to main content — keyboard navigation accessibility */
.skip-to-content {
position: absolute;
left: -9999px;
top: auto;
width: 1px;
height: 1px;
overflow: hidden;
z-index: 9999;
}
.skip-to-content:focus {
position: fixed;
top: 12px;
left: 50%;
transform: translateX(-50%);
width: auto;
height: auto;
overflow: visible;
padding: 8px 24px;
background: rgba(0, 0, 0, 0.85);
color: white;
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 8px;
font-size: 14px;
font-weight: 500;
text-decoration: none;
backdrop-filter: blur(12px);
}
/* Controller / keyboard navigation - soft glow only (no box outline) */
*:focus-visible {
outline: none;