From f6563f22a9a0c9d876f80e8f758b902dcc3bec78 Mon Sep 17 00:00:00 2001
From: Martin Kagamino Lehoux <martin@lehoux.net>
Date: Tue, 6 Oct 2026 00:05:49 +0200
Subject: Restyle to a flat Miniflux-like design

- hairline separators instead of bordered rows, square corners, no shadows
- white background, system font stack, slimmer headings
- pine green accent; amber warn ramp carries the attention marks (due/late/mid)
- no hover backgrounds: hover is color/fill-state only
- reserve bold nav tab width and the scrollbar gutter so navigation never shifts layout
---
 src/routes/groceries/catalog/+page.svelte               |  3 +--
 src/routes/grocery/[id]/+page.svelte                    | 17 +++--------------
 src/routes/login/+page.svelte                           |  3 +--
 src/routes/projects/[id]/+page.svelte                   |  5 +----
 .../[projectId]/routine/[routineId]/+page.svelte        |  7 ++++---
 5 files changed, 10 insertions(+), 25 deletions(-)

(limited to 'src/routes')

diff --git a/src/routes/groceries/catalog/+page.svelte b/src/routes/groceries/catalog/+page.svelte
index 076d3ce..769b49b 100644
--- a/src/routes/groceries/catalog/+page.svelte
+++ b/src/routes/groceries/catalog/+page.svelte
@@ -122,9 +122,8 @@
 
 	.search-input {
 		width: 100%;
-		padding: 0.75rem 1rem;
+		padding: 0.5rem 0.625rem;
 		border: 1px solid var(--border);
-		border-radius: 0.5rem;
 		background: var(--surface);
 		color: var(--text);
 		font-size: 1rem;
diff --git a/src/routes/grocery/[id]/+page.svelte b/src/routes/grocery/[id]/+page.svelte
index c672730..56e57fd 100644
--- a/src/routes/grocery/[id]/+page.svelte
+++ b/src/routes/grocery/[id]/+page.svelte
@@ -142,7 +142,7 @@
 	{/if}
 
 	<form method="POST" action="?/delete" use:enhance>
-		<ul class="item-list item-list--wide">
+		<ul class="item-list">
 			{#each data?.references ?? [] as ref (ref.id)}
 				<Row variant="ref">
 					<div class="ref-info">
@@ -184,7 +184,6 @@
 		margin-top: -0.25rem;
 		visibility: hidden;
 		opacity: 0;
-		transition: opacity 0.2s ease;
 		min-height: 1.25rem;
 	}
 
@@ -215,9 +214,6 @@
 		color: var(--text-secondary);
 		font-size: 0.875rem;
 		font-weight: 500;
-		background: var(--bg);
-		padding: 0.125rem 0.5rem;
-		border-radius: 0.375rem;
 	}
 
 	.error {
@@ -227,25 +223,18 @@
 
 	hr {
 		border: none;
-		border-top: 1.5px solid var(--border);
+		border-top: 1px solid var(--border);
 		margin: 1.5rem 0;
 	}
 
 	.delete-item-btn {
 		margin-top: 1.5rem;
 		padding: 0.625rem 1.25rem;
-		border: 1.5px solid var(--danger);
-		border-radius: 0.75rem;
+		border: 1px solid var(--danger);
 		background: var(--surface);
 		color: var(--danger);
 		font-size: 0.875rem;
 		font-weight: 500;
 		cursor: pointer;
-		transition: all 0.2s ease;
-	}
-
-	.delete-item-btn:hover {
-		background: var(--danger-bg);
-		transform: translateY(-1px);
 	}
 </style>
diff --git a/src/routes/login/+page.svelte b/src/routes/login/+page.svelte
index 3da1529..a95fde7 100644
--- a/src/routes/login/+page.svelte
+++ b/src/routes/login/+page.svelte
@@ -45,8 +45,7 @@
 		width: min(100%, 24rem);
 		padding: 1.5rem;
 		background: var(--surface);
-		border-radius: 0.75rem;
-		box-shadow: 0 2px 8px var(--shadow);
+		border: 1px solid var(--border);
 	}
 
 	.login-card h1 {
diff --git a/src/routes/projects/[id]/+page.svelte b/src/routes/projects/[id]/+page.svelte
index 0f3e857..37113df 100644
--- a/src/routes/projects/[id]/+page.svelte
+++ b/src/routes/projects/[id]/+page.svelte
@@ -271,18 +271,15 @@
 		gap: 0.5rem;
 		padding: 0.375rem 0.75rem;
 		border: none;
-		border-radius: 0.625rem;
 		background: transparent;
 		color: var(--text-secondary);
 		font-family: inherit;
 		font-size: 0.875rem;
 		font-weight: 500;
 		cursor: pointer;
-		transition: all 0.2s ease;
 	}
 
 	.archived-toggle:hover {
-		background: var(--surface);
 		color: var(--text);
 	}
 
@@ -293,7 +290,7 @@
 	.archived-toggle .count {
 		min-width: 1.25rem;
 		padding: 0 0.375rem;
-		border-radius: 9999px;
+		border: 1px solid var(--border);
 		background: var(--surface);
 		text-align: center;
 		font-size: 0.75rem;
diff --git a/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte b/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte
index 2dc5427..591f4b7 100644
--- a/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte
+++ b/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte
@@ -304,10 +304,11 @@
 	.save-check {
 		position: absolute;
 		right: 1rem;
-		top: 50%;
-		transform: translateY(-50%);
+		top: 0;
+		bottom: 0;
+		display: inline-flex;
+		align-items: center;
 		opacity: 0;
-		transition: opacity 0.2s ease;
 	}
 
 	.save-check.visible {
-- 
cgit v1.3