feat(web): add theme system with Obsidian, Paper, and Midnight themes

Three holistic design directions with CSS custom properties, a theme
store persisted to localStorage, and a live switcher in both the header
(cycle button) and settings page (card selector). Also fixes checkbox
checkmark alignment and adds back navigation from settings.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-02-14 22:36:07 +01:00
parent 6c2fc6960a
commit 0352c22b4f
9 changed files with 462 additions and 67 deletions
+9 -5
View File
@@ -2,7 +2,7 @@
import PropertyPills from './PropertyPills.svelte';
/**
* @type {(input: string) => void}
* @type {(input: string) => Promise<void>}
*/
export let onSubmit;
@@ -18,11 +18,15 @@
/** @type {ReturnType<typeof setTimeout>|null} */
let blurTimer = null;
function handleSubmit() {
async function handleSubmit() {
const trimmed = value.trim();
if (!trimmed || loading) return;
onSubmit(trimmed);
value = '';
try {
await onSubmit(trimmed);
value = '';
} catch {
// Value preserved for retry
}
}
/**
@@ -147,7 +151,7 @@
.input:focus {
outline: none;
border-color: var(--color-primary);
box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15);
box-shadow: 0 0 0 2px var(--focus-ring);
}
.submit-btn {