From 0eb5c95c6c90f1ec0ab05eae84ddca99de301d3f Mon Sep 17 00:00:00 2001 From: Marcel Date: Fri, 24 Apr 2026 19:45:03 +0200 Subject: [PATCH] fix(forms): raise date and sender field height to match receiver (44px) PersonMultiSelect naturally renders at 44px due to nested padding (outer p-2 + inner p-1). Apply py-3 px-2 to the date input and PersonTypeahead default mode so all three fields align visually. Co-Authored-By: Claude Sonnet 4.6 --- frontend/src/lib/components/PersonTypeahead.svelte | 2 +- frontend/src/lib/components/document/WhoWhenSection.svelte | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/src/lib/components/PersonTypeahead.svelte b/frontend/src/lib/components/PersonTypeahead.svelte index cc667d2d..815623da 100644 --- a/frontend/src/lib/components/PersonTypeahead.svelte +++ b/frontend/src/lib/components/PersonTypeahead.svelte @@ -134,7 +134,7 @@ function selectPerson(person: Person) { ? 'mt-2 block h-14 w-full rounded-md border border-line bg-surface px-4 text-base text-ink shadow-sm placeholder:text-ink-3 focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring' : compact ? 'mt-1 block h-9 w-full rounded border border-line bg-surface px-2 text-sm text-ink placeholder:text-ink-3 focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring' - : 'mt-1 block w-full rounded border border-line bg-surface p-2 text-sm text-ink shadow-sm placeholder:text-ink-3 focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring'} + : 'mt-1 block w-full rounded border border-line bg-surface px-2 py-3 text-sm text-ink shadow-sm placeholder:text-ink-3 focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring'} /> {#if typeahead.isOpen && (typeahead.results.length > 0 || typeahead.loading)} diff --git a/frontend/src/lib/components/document/WhoWhenSection.svelte b/frontend/src/lib/components/document/WhoWhenSection.svelte index ff8a044b..d315be42 100644 --- a/frontend/src/lib/components/document/WhoWhenSection.svelte +++ b/frontend/src/lib/components/document/WhoWhenSection.svelte @@ -72,7 +72,7 @@ $effect(() => { placeholder={m.form_placeholder_date()} maxlength="10" autofocus={autofocus && !initialDateIso} - class="block w-full rounded border border-line p-2 text-sm shadow-sm + class="block w-full rounded border border-line px-2 py-3 text-sm shadow-sm {dateInvalid ? 'border-red-400 focus:outline-none focus-visible:ring-2 focus-visible:ring-red-500' : 'focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring'}" aria-describedby={dateInvalid ? 'date-error' : undefined} />