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

fix(forms): raise date and sender field height to match receiver (44px)

Browse Source 
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 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-04-24 19:45:03 +02:00
parent 65846911f3
commit 1ea95f8fe0
2 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/lib/components/PersonTypeahead.svelte
View File

@@ -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)}

2
frontend/src/lib/components/document/WhoWhenSection.svelte
View File

@@ -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}
/>