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

fix(PersonHoverCard): move chip colon into DOM for consistent screen reader announcement
Some checks failed
CI / Unit & Component Tests (push) Failing after 3m24s
Details
CI / OCR Service Tests (push) Successful in 29s
Details
CI / Backend Unit Tests (push) Failing after 2m59s
Details
CI / Unit & Component Tests (pull_request) Failing after 3m25s
Details
CI / OCR Service Tests (pull_request) Successful in 38s
Details
CI / Backend Unit Tests (pull_request) Failing after 3m19s
Details

Browse Source 
Replaces CSS ::after { content: ':' } with literal colon inside the
chip-type span. CSS-generated content is announced inconsistently
across NVDA+Chrome and VoiceOver+Safari; a real text node is always
reliable.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-29 20:32:21 +02:00
parent 0113367d05
commit 96d9ff5db1
1 changed files with 1 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/lib/components/PersonHoverCard.svelte
View File

@@ -131,7 +131,7 @@ const showMaidenName = $derived(
<div class="chips" data-testid="person-hover-card-chips"> <div class="chips" data-testid="person-hover-card-chips">
{#each familyChips as chip (chip.id)} {#each familyChips as chip (chip.id)}
<span class="chip"> <span class="chip">
<span class="chip-type">{chipLabel(chip, personId)}</span> <span class="chip-type">{chipLabel(chip, personId)}:</span>
{otherName(chip, personId)} {otherName(chip, personId)}
</span> </span>
{/each} {/each}
@@ -261,10 +261,6 @@ const showMaidenName = $derived(
opacity: 0.7; opacity: 0.7;
} }
.chip-type::after {
content: ':';
}
.notes { .notes {
font-size: 13px; font-size: 13px;
color: var(--c-ink-2); color: var(--c-ink-2);