mirror of
https://github.com/shadoll/sLogos.git
synced 2025-12-20 10:31:59 +00:00
Enhance accessibility: Add ARIA roles and keyboard navigation to reset confirmation dialog in FlagQuiz page; remove unused CSS class from AchievementButton component
This commit is contained in:
@@ -415,7 +415,18 @@
|
||||
|
||||
<!-- Reset Confirmation Dialog -->
|
||||
{#if showResetConfirmation}
|
||||
<div class="confirmation-overlay" on:click={(e) => e.target === e.currentTarget && cancelReset()}>
|
||||
<div
|
||||
class="confirmation-overlay"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
aria-label="Close confirmation dialog (click background or press Escape)"
|
||||
on:click={(e) => e.target === e.currentTarget && cancelReset()}
|
||||
on:keydown={(e) => {
|
||||
if (e.key === 'Escape' || e.key === 'Enter' || e.key === ' ') {
|
||||
cancelReset();
|
||||
}
|
||||
}}
|
||||
>
|
||||
<div class="confirmation-dialog">
|
||||
<div class="confirmation-header">
|
||||
<h3>⚠️ Reset All Data</h3>
|
||||
|
||||
Reference in New Issue
Block a user