From 6e5dcdb53cea4c3f082d01c937fe5fc1d580c45b Mon Sep 17 00:00:00 2001 From: Martin Kagamino Lehoux Date: Tue, 6 Oct 2026 00:53:46 +0200 Subject: fix: unify add-bar input and button heights at 2.75rem MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The quick-add input computed to 40px while the square accent/outline buttons were hard-coded 3rem, leaving an 8px overhang. Give add-bar controls one shared height of 2.75rem — the nav/row rhythm and the 44px touch-target minimum — in the three places that render them (Button squares, .add-bar input, FuzzyAutocomplete input). --- README.md | 1 - src/app.css | 1 + src/lib/components/Button.svelte | 8 ++++---- src/lib/components/FuzzyAutocomplete.svelte | 1 + 4 files changed, 6 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index cd4ed0f..0eed298 100644 --- a/README.md +++ b/README.md @@ -81,4 +81,3 @@ mise run deploy - Auto-categorize new items (LLM-assisted) - https://automerge.org/docs/tutorial/ - Shared > Modal actions -- Input + buttons sizes (ajouter un article) diff --git a/src/app.css b/src/app.css index e94a77e..4225649 100644 --- a/src/app.css +++ b/src/app.css @@ -81,6 +81,7 @@ .add-bar input { flex: 1; min-width: 0; + height: 2.75rem; } /* Shared route scaffolding */ diff --git a/src/lib/components/Button.svelte b/src/lib/components/Button.svelte index cfd24f7..328af3d 100644 --- a/src/lib/components/Button.svelte +++ b/src/lib/components/Button.svelte @@ -75,8 +75,8 @@ } .accent { - width: 3rem; - height: 3rem; + width: 2.75rem; + height: 2.75rem; flex-shrink: 0; padding: 0; background: var(--accent); @@ -128,8 +128,8 @@ } .outline { - width: 3rem; - height: 3rem; + width: 2.75rem; + height: 2.75rem; flex-shrink: 0; padding: 0; background: var(--surface); diff --git a/src/lib/components/FuzzyAutocomplete.svelte b/src/lib/components/FuzzyAutocomplete.svelte index da7327e..f2125e6 100644 --- a/src/lib/components/FuzzyAutocomplete.svelte +++ b/src/lib/components/FuzzyAutocomplete.svelte @@ -117,6 +117,7 @@ .autocomplete :global(.form-input) { width: 100%; + height: 2.75rem; } .dropdown { -- cgit v1.3