From 1e720925e2ef690d455927c2f9e802571304982a Mon Sep 17 00:00:00 2001
From: Martin Kagamino Lehoux <martin@lehoux.net>
Date: Tue, 28 Jul 2026 19:30:07 +0200
Subject: fix: sticky form and navbar layout with consistent nav-height

---
 src/routes/catalog/+page.svelte | 82 +++++++++++++++++++++--------------------
 1 file changed, 42 insertions(+), 40 deletions(-)

(limited to 'src/routes/catalog/+page.svelte')

diff --git a/src/routes/catalog/+page.svelte b/src/routes/catalog/+page.svelte
index 469faa1..525c2ed 100644
--- a/src/routes/catalog/+page.svelte
+++ b/src/routes/catalog/+page.svelte
@@ -15,46 +15,48 @@
 	}
 </script>
 
-{#if catalogItems.length === 0}
-	<p class="empty">Aucun article</p>
-{:else}
-	<form method="POST" action="?/toggle" use:enhance>
-		{#each groupByCategory(catalogItems) as [cat, items] (cat)}
-			<h3 class="category-name">{cat}</h3>
-			<ul class="item-list">
-				{#each items as item (item.id)}
-					<li class="item-row item-row--fixed">
-						<button
-							class="item-btn item-btn--grow"
-							name="id"
-							value={item.id}
-							type="submit"
-							aria-pressed={item.checked}
-						>
-							<span class="item-text">
-								<span class:checked={item.checked}>{item.name}</span>
-								{#if item.bestRef}
-									<span class="best-ref"
-										>{item.bestRef.reference}
-										{#if item.bestRef.price && item.bestRef.unit}
-											&nbsp;{item.bestRef.price.toFixed(2)} {item.bestRef.unit}
-										{/if}
-										{#if item.bestRef.qualityScore != null}
-											&nbsp;({item.bestRef.qualityScore}/100)
-										{/if}
-									</span>
-								{/if}
-							</span>
-						</button>
-						<a class="ref-link" href="/grocery/{item.id}?from=/catalog"
-							>&rarr;</a
-						>
-					</li>
-				{/each}
-			</ul>
-		{/each}
-	</form>
-{/if}
+<main>
+	{#if catalogItems.length === 0}
+		<p class="empty">Aucun article</p>
+	{:else}
+		<form method="POST" action="?/toggle" use:enhance>
+			{#each groupByCategory(catalogItems) as [cat, items] (cat)}
+				<h3 class="category-name">{cat}</h3>
+				<ul class="item-list">
+					{#each items as item (item.id)}
+						<li class="item-row item-row--fixed">
+							<button
+								class="item-btn item-btn--grow"
+								name="id"
+								value={item.id}
+								type="submit"
+								aria-pressed={item.checked}
+							>
+								<span class="item-text">
+									<span class:checked={item.checked}>{item.name}</span>
+									{#if item.bestRef}
+										<span class="best-ref"
+											>{item.bestRef.reference}
+											{#if item.bestRef.price && item.bestRef.unit}
+												&nbsp;{item.bestRef.price.toFixed(2)} {item.bestRef.unit}
+											{/if}
+											{#if item.bestRef.qualityScore != null}
+												&nbsp;({item.bestRef.qualityScore}/100)
+											{/if}
+										</span>
+									{/if}
+								</span>
+							</button>
+							<a class="ref-link" href="/grocery/{item.id}?from=/catalog"
+								>&rarr;</a
+							>
+						</li>
+					{/each}
+				</ul>
+			{/each}
+		</form>
+	{/if}
+</main>
 
 <style>
 	.checked {
-- 
cgit v1.3