fix(a11y): enlarge mood tag chips to the 44px tap target

The structured-tag picker chips and the side-effect chips sat at 32px
(min-h-8), under the 44px minimum and a fat-finger risk on a phone where
they wrap tightly. Bump both to min-h-11 with matched padding so the tap
target clears 44px without loosening the visual density.
This commit is contained in:
Marc-André Bombeck committed 2026-06-01 21:17:02 +02:00
1 parent baa1ff250c
commit bd0b284201
2 files changed
+2 -2

No files matched your search

+1 -1
View File
@@ -313,7 +313,7 @@ export function MoodForm({ onSuccess, onCancel, footerSlot }: MoodFormProps) {
setTagsInput(next);
}
}}
className={`min-h-8 rounded-full border px-2.5 py-1 text-xs transition-colors ${
className={`inline-flex min-h-11 items-center rounded-full border px-3 py-2 text-xs transition-colors ${
isActive
? "border-primary bg-primary/15 text-primary"
: "border-border/70 bg-muted text-foreground/75 hover:bg-accent hover:text-foreground"
+1 -1
View File
@@ -92,7 +92,7 @@ export function MoodTagPicker({
type="button"
onClick={() => onToggle(tag.key)}
aria-pressed={isActive}
className={`inline-flex min-h-8 items-center gap-1.5 rounded-full border px-2.5 py-1 text-xs transition-colors ${
className={`inline-flex min-h-11 items-center gap-1.5 rounded-full border px-3 py-2 text-xs transition-colors ${
isActive
? "border-primary bg-primary/15 text-primary"
: "border-border/70 bg-muted text-foreground/75 hover:bg-accent hover:text-foreground"