janpeter/Scrum4Me
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

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

Browse source 
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
Download patch file Download diff file Expand all files Collapse all files

6
components/backlog/pbi-list.tsx
View file

@ -157,7 +157,7 @@ function SortablePbiRow({
isDragging={isDragging} isDragging={isDragging}
role="button" role="button"
tabIndex={0} tabIndex={0}
aria-selected={isSelected} aria-pressed={isSelected}
onClick={onSelect} onClick={onSelect}
onKeyDown={(e: React.KeyboardEvent) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onSelect() } }} onKeyDown={(e: React.KeyboardEvent) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onSelect() } }}
badge={ badge={
@ -170,7 +170,7 @@ function SortablePbiRow({
<DemoTooltip show={isDemo}> <DemoTooltip show={isDemo}>
<button <button
onClick={(e) => { e.stopPropagation(); if (!isDemo) onEdit() }} 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" aria-label="Bewerk PBI"
disabled={isDemo} disabled={isDemo}
> >
@ -180,7 +180,7 @@ function SortablePbiRow({
<DemoTooltip show={isDemo}> <DemoTooltip show={isDemo}>
<button <button
onClick={(e) => { e.stopPropagation(); if (!isDemo) onDelete() }} 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" aria-label="Verwijder PBI"
disabled={isDemo} disabled={isDemo}
> >

2
components/backlog/story-panel.tsx
View file

@ -106,7 +106,7 @@ function SortableStoryBlock({
actions={ actions={
<button <button
onClick={(e) => { e.stopPropagation(); onEdit() }} 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" aria-label="Story bewerken"
> >
<svg className="size-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"> <svg className="size-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">

2
components/dashboard/product-list.tsx
View file

@ -109,7 +109,7 @@ export function ProductList({ products, isDemo, showArchived = false, activeProd
<DemoTooltip show={isDemo}> <DemoTooltip show={isDemo}>
<button <button
onClick={(e) => { e.stopPropagation(); if (!isDemo) setEditingProduct(product) }} 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" aria-label="Bewerk product"
disabled={isDemo} disabled={isDemo}
> >