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

fix(transcribe-coach): propagate hover from 44px button group to inner span
Some checks failed
CI / Backend Unit Tests (push) Has been cancelled
Details
CI / OCR Service Tests (push) Has been cancelled
Details
CI / Unit & Component Tests (push) Has started running
Details

Browse Source 
hover: on the <span> only fired on the 20×20px visual circle, not the
full 44×44px touch target. Add `group` + `focus-visible:ring-*` to the
outer button; switch to `group-hover:` on the inner span so the visual
response covers the entire interactive area.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit was merged in pull request #330.
This commit is contained in:
Marcel
2026-04-25 11:52:11 +02:00
committed by marcel
parent c335ddd686
commit 48d034dcb8
2 changed files with 24 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/lib/components/HelpPopover.svelte
View File

@@ -77,10 +77,10 @@ const placementClass: Record<Placement, string> = {
aria-expanded={open}
aria-controls={popoverId}
onclick={toggle}
class="flex h-[44px] w-[44px] items-center justify-center"
class="group flex h-[44px] w-[44px] items-center justify-center rounded-full focus-visible:ring-2 focus-visible:ring-brand-navy"
>
<span
class="flex h-5 w-5 items-center justify-center rounded-full border border-line bg-muted font-sans text-[10px] font-bold text-ink-3 transition-colors hover:border-brand-navy hover:text-brand-navy"
class="flex h-5 w-5 items-center justify-center rounded-full border border-line bg-muted font-sans text-[10px] font-bold text-ink-3 transition-colors group-hover:border-brand-navy group-hover:text-brand-navy"
>
?
</span>