diff options
| author | Martin Kagamino Lehoux <martin@lehoux.net> | 2026-09-12 22:26:09 +0200 |
|---|---|---|
| committer | Martin Kagamino Lehoux <martin@lehoux.net> | 2026-09-12 22:26:09 +0200 |
| commit | 2a7c4f969874b850e30170f3aef5b578677220b0 (patch) | |
| tree | 7fafc0aaf017d4f045cedd92a6fa2d55024fb63d /src/lib/components/SectionTitle.svelte | |
| parent | 5f0a73920034741236034ed7a721c68eceb8ab82 (diff) | |
Scope badges, titles, and one-off styles; add Button outline
ScoreBadge/StatusBadge carry their own color scales, no
bg-*/text-* globals. SectionTitle unifies category-name and
section-title dupes (h2/h3 via level prop). Grocery add-bar
buttons use Button, new outline variant for the secondary
action. save-status moves into its only page. Delete dead
globals and page overrides.
Diffstat (limited to 'src/lib/components/SectionTitle.svelte')
| -rw-r--r-- | src/lib/components/SectionTitle.svelte | 23 |
1 files changed, 23 insertions, 0 deletions
diff --git a/src/lib/components/SectionTitle.svelte b/src/lib/components/SectionTitle.svelte new file mode 100644 index 0000000..be77a46 --- /dev/null +++ b/src/lib/components/SectionTitle.svelte @@ -0,0 +1,23 @@ +<script lang="ts"> + import type { Snippet } from 'svelte'; + + let { level = 2, children }: { level?: 2 | 3; children: Snippet } = $props(); +</script> + +<svelte:element this={level === 2 ? 'h2' : 'h3'}> + {@render children()} +</svelte:element> + +<style> + h2, + h3 { + font-size: 0.75rem; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.08em; + color: var(--accent); + margin: 1.25rem 0 0.5rem; + padding-left: 0.5rem; + border-left: 3px solid var(--accent); + } +</style> |