Merge pull request #88 from madhura68/feat/a11y-tap-targets-aria

fix(a11y): tap targets ≥28px + aria-pressed on PBI-card (Lighthouse #4 follow-up)
This commit is contained in:
Janpeter Visser 2026-05-04 14:09:13 +02:00 committed by GitHub
commit 54a2511476
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 5 additions and 5 deletions

View file

@ -157,7 +157,7 @@ function SortablePbiRow({
isDragging={isDragging}
role="button"
tabIndex={0}
aria-selected={isSelected}
aria-pressed={isSelected}
onClick={onSelect}
onKeyDown={(e: React.KeyboardEvent) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onSelect() } }}
badge={
@ -170,7 +170,7 @@ function SortablePbiRow({
<DemoTooltip show={isDemo}>
<button
onClick={(e) => { e.stopPropagation(); if (!isDemo) onEdit() }}
className="border border-border rounded px-1.5 py-0.5 text-xs text-muted-foreground hover:text-foreground hover:bg-surface-container transition-colors disabled:opacity-40 disabled:cursor-not-allowed"
className="inline-flex items-center justify-center min-h-7 min-w-7 border border-border rounded text-xs text-muted-foreground hover:text-foreground hover:bg-surface-container transition-colors disabled:opacity-40 disabled:cursor-not-allowed"
aria-label="Bewerk PBI"
disabled={isDemo}
>
@ -180,7 +180,7 @@ function SortablePbiRow({
<DemoTooltip show={isDemo}>
<button
onClick={(e) => { e.stopPropagation(); if (!isDemo) onDelete() }}
className="text-muted-foreground hover:text-error text-xs disabled:opacity-40 disabled:cursor-not-allowed"
className="inline-flex items-center justify-center min-h-7 min-w-7 text-muted-foreground hover:text-error text-base leading-none disabled:opacity-40 disabled:cursor-not-allowed"
aria-label="Verwijder PBI"
disabled={isDemo}
>

View file

@ -106,7 +106,7 @@ function SortableStoryBlock({
actions={
<button
onClick={(e) => { e.stopPropagation(); onEdit() }}
className="text-muted-foreground hover:text-foreground p-0.5 rounded transition-colors"
className="inline-flex items-center justify-center min-h-7 min-w-7 text-muted-foreground hover:text-foreground rounded transition-colors"
aria-label="Story bewerken"
>
<svg className="size-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">

View file

@ -109,7 +109,7 @@ export function ProductList({ products, isDemo, showArchived = false, activeProd
<DemoTooltip show={isDemo}>
<button
onClick={(e) => { e.stopPropagation(); if (!isDemo) setEditingProduct(product) }}
className="opacity-0 group-hover:opacity-100 text-muted-foreground hover:text-foreground p-0.5 rounded disabled:opacity-40 disabled:cursor-not-allowed"
className="opacity-0 group-hover:opacity-100 inline-flex items-center justify-center min-h-7 min-w-7 text-muted-foreground hover:text-foreground rounded disabled:opacity-40 disabled:cursor-not-allowed"
aria-label="Bewerk product"
disabled={isDemo}
>