marcel/familienarchiv
1
0
Fork 0
Code Issues 105 Pull Requests Actions 2 Packages Projects Releases Wiki Activity

fix(a11y): view-all links meet 44px touch target

Browse Source 
WCAG 2.2 §2.5.8 (Target Size, Minimum). The Alle Personen → and Alle
Geschichten → text links were inline elements with no enforced minimum
height — small tap targets on mobile. inline-flex + min-h-[44px] keeps
the visual layout while guaranteeing the 44px hit area.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-05-08 12:48:06 +02:00
committed by marcel
parent f7eefb525f
commit b1c2132aa6
4 changed files with 16 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/lib/shared/dashboard/ReaderPersonChips.svelte.spec.ts
View File

@@ -66,6 +66,13 @@ describe('ReaderPersonChips', () => {
expect(cls).toMatch(/focus-visible:ring-brand-navy/);
});
it('meets the 44px touch target on the "Alle Personen" link', async () => {
render(ReaderPersonChips, { persons: [person1] });
const allLink = page.getByRole('link', { name: /Alle Personen/i });
const cls = ((await allLink.element()) as HTMLElement).className;
expect(cls).toMatch(/min-h-\[44px\]/);
});
it('renders empty state without chips when persons array is empty', async () => {
render(ReaderPersonChips, { persons: [] });
const chips = page.getByRole('link', { name: /Müller|Schmidt/ });