Files
familienarchiv/frontend/src/lib/components/GroupDivider.svelte
Marcel f522ab633c 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>
2026-04-15 09:38:37 +02:00

16 lines
416 B
Svelte

<script lang="ts">
let { label }: { label: string } = $props();
</script>
<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-sm font-bold tracking-widest text-ink/60 uppercase">{label}</span
>
<div class="flex-grow border-t border-line"></div>
</div>