From f522ab633c6fe3cdd02e8815c96ed728e82e2e6b Mon Sep 17 00:00:00 2001
From: Marcel <marcel@familienarchiv>
Date: Wed, 15 Apr 2026 09:38:37 +0200
Subject: [PATCH] fix(a11y): bump GroupDivider contrast and add separator role

text-xs text-ink/40 (~2.1:1) fails WCAG AA; text-sm bold at text-ink/60
(~3.7:1) passes the large-text 3:1 threshold. Also adds role="separator"
and aria-label so screen readers announce the group boundary.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/lib/components/GroupDivider.svelte | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/frontend/src/lib/components/GroupDivider.svelte b/frontend/src/lib/components/GroupDivider.svelte
index 9d732afc..d769b6d7 100644
--- a/frontend/src/lib/components/GroupDivider.svelte
+++ b/frontend/src/lib/components/GroupDivider.svelte
@@ -2,9 +2,14 @@
 let { label }: { label: string } = $props();
 </script>
 
-<div data-testid="group-divider" class="relative flex items-center py-2 text-center">
+<div
+	data-testid="group-divider"
+	role="separator"
+	aria-label={label}
+	class="relative flex items-center py-2 text-center"
+>
 	<div class="flex-grow border-t border-line"></div>
-	<span class="mx-4 font-sans text-xs font-bold tracking-widest text-ink/40 uppercase">{label}</span
+	<span class="mx-4 font-sans text-sm font-bold tracking-widest text-ink/60 uppercase">{label}</span
 	>
 	<div class="flex-grow border-t border-line"></div>
 </div>