add ARIA labels and pressed states to board list and remaining components

This commit is contained in:
Your Name
2026-02-19 19:55:30 +02:00
parent d66e90a6d5
commit 0b155c6023
5 changed files with 8 additions and 2 deletions

View File

@@ -170,6 +170,7 @@ export function NewBoardDialog({ open, onOpenChange }: NewBoardDialogProps) {
variant={template === t && !selectedUserTemplate ? "default" : "outline"}
size="sm"
onClick={() => { setTemplate(t); setSelectedUserTemplate(null); }}
aria-pressed={template === t && !selectedUserTemplate}
className="capitalize"
>
{t}
@@ -182,6 +183,7 @@ export function NewBoardDialog({ open, onOpenChange }: NewBoardDialogProps) {
variant={selectedUserTemplate?.id === ut.id ? "default" : "outline"}
size="sm"
onClick={() => { setSelectedUserTemplate(ut); setColor(ut.color); }}
aria-pressed={selectedUserTemplate?.id === ut.id}
>
<span
className="inline-block size-2 rounded-full shrink-0"
@@ -193,7 +195,7 @@ export function NewBoardDialog({ open, onOpenChange }: NewBoardDialogProps) {
type="button"
onClick={() => handleDeleteTemplate(ut.id)}
className="rounded p-0.5 text-pylon-text-secondary opacity-0 hover:opacity-100 hover:bg-pylon-danger/10 hover:text-pylon-danger transition-opacity"
title="Delete template"
aria-label="Delete template"
>
<X className="size-3" />
</button>