lfg2025/archy
1
0
Fork 0
Code Issues 25 Pull Requests 4 Actions Packages Projects Releases 74 Wiki Activity

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

Browse Source 
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
co-authored by Claude Opus 4.6
parent c273ec758f
commit b9cc0a924e
7 changed files with 460 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files
neode-ui/src/views/Settings.vue
+6 -4
View File
@@ -233,11 +233,12 @@
v-if="showTotpSetupModal"
class="fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/60 backdrop-blur-sm"
@click.self="closeTotpSetup"
@keydown.escape="closeTotpSetup"
>
<div class="glass-card p-6 max-w-md w-full">
<div class="glass-card p-6 max-w-md w-full" role="dialog" aria-modal="true" aria-labelledby="totp-setup-title">
<!-- Step 1: Enter password -->
<template v-if="totpSetupStep === 1">
<h3 class="text-lg font-semibold text-white mb-2">Enable Two-Factor Authentication</h3>
<h3 id="totp-setup-title" class="text-lg font-semibold text-white mb-2">Enable Two-Factor Authentication</h3>
<p class="text-white/60 text-sm mb-4">Enter your password to begin setup.</p>
<form @submit.prevent="beginTotpSetup" class="space-y-4">
<input
@@ -338,9 +339,10 @@
v-if="showTotpDisableModal"
class="fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/60 backdrop-blur-sm"
@click.self="closeTotpDisable"
@keydown.escape="closeTotpDisable"
>
<div class="glass-card p-6 max-w-md w-full">
<h3 class="text-lg font-semibold text-white mb-2">Disable Two-Factor Authentication</h3>
<div class="glass-card p-6 max-w-md w-full" role="dialog" aria-modal="true" aria-labelledby="totp-disable-title">
<h3 id="totp-disable-title" class="text-lg font-semibold text-white mb-2">Disable Two-Factor Authentication</h3>
<p class="text-white/60 text-sm mb-4">Enter your password and a current TOTP code to disable 2FA.</p>
<form @submit.prevent="disableTotp" class="space-y-4">
<div>