From e075698891d653330b5d5d0f80c2c3495aee6262 Mon Sep 17 00:00:00 2001
From: Martin Kagamino Lehoux <martin@lehoux.net>
Date: Mon, 27 Jul 2026 19:53:11 +0200
Subject: feat: product references + grocery detail page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- references table (brand, price, unit, quality_score) with FK to groceries
- /grocery/[id] page for managing references per item
- Unit dropdown (€/kg, €/L, €/u) defaulting to €/kg
- → link on all items navigates to detail page
- Delete item moved from catalog to detail page
---
 src/routes/+page.svelte | 32 ++++++++++++++------------------
 1 file changed, 14 insertions(+), 18 deletions(-)

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

diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 9490a51..64c8410 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -57,10 +57,11 @@
 			<h3 class="category-name">{cat}</h3>
 			<ul class="item-list">
 				{#each items as item (item.id)}
-					<li>
+					<li class="catalog-item">
 						<button name="id" value={item.id} type="submit">
 							{item.name}
 						</button>
+						<a class="ref-link" href="/grocery/{item.id}">&rarr;</a>
 					</li>
 				{/each}
 			</ul>
@@ -84,15 +85,7 @@
 						<button name="id" value={item.id} type="submit">
 							{item.name}
 						</button>
-						<button
-							class="delete-btn"
-							name="id"
-							value={item.id}
-							type="submit"
-							formaction="?/delete"
-						>
-							&times;
-						</button>
+						<a class="ref-link" href="/grocery/{item.id}">&rarr;</a>
 					</li>
 				{/each}
 			</ul>
@@ -191,20 +184,23 @@
 		align-items: center;
 	}
 
-	.catalog-item .delete-btn {
-		border: 1px solid #e0e0e0;
-		border-radius: 0.5rem;
-		background: #fff;
-		color: #d00;
-		transition: background 0.15s;
+	.ref-link {
 		width: 2rem;
+		aspect-ratio: 1;
 		display: flex;
 		align-items: center;
 		justify-content: center;
+		border: 1px solid #e0e0e0;
+		border-radius: 0.5rem;
+		background: #fff;
+		color: #333;
+		text-decoration: none;
+		font-size: 1rem;
+		transition: background 0.15s;
 	}
 
-	.catalog-item .delete-btn:hover {
-		background: #fee;
+	.ref-link:hover {
+		background: #f5f5f5;
 	}
 
 	.empty {
-- 
cgit v1.3