Apply Finlio cream/terracotta design system

Re-theme dashboard, suivi, plan, and flux pages plus nav from the
claude.ai/design import: warm cream/terracotta/olive palette, pill
nav/buttons/inputs, Caprasimo display font for headings. Dark mode
variant derived to hold the existing WCAG AA contrast ratios since
the import only specified light.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
jeremy bayse
2026-08-01 21:21:17 +02:00
co-authored by Claude Sonnet 5
parent 97dc7cdb2a
commit 52ebb9bc83
12 changed files with 133 additions and 124 deletions
@@ -1,10 +1,10 @@
<div class="max-w-[1600px] mx-auto py-6 px-4 sm:px-6 space-y-6">
<div class="flex items-center justify-between">
<h1 class="text-xl font-semibold text-text">Plan</h1>
<div class="flex items-center gap-2">
<button wire:click="setYear({{ $year - 1 }})" aria-label="Année précédente" class="px-2 py-1 text-sm rounded-md border border-border-strong text-text focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring">&lsaquo;</button>
<span class="text-sm font-medium text-text-muted w-16 text-center">{{ $year }}</span>
<button wire:click="setYear({{ $year + 1 }})" aria-label="Année suivante" class="px-2 py-1 text-sm rounded-md border border-border-strong text-text focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring">&rsaquo;</button>
<h1 class="text-3xl font-display text-text">Plan</h1>
<div class="flex items-center gap-3 bg-surface shadow rounded-full px-2 py-1.5">
<button wire:click="setYear({{ $year - 1 }})" aria-label="Année précédente" class="w-8 h-8 flex items-center justify-center rounded-full text-text-muted hover:bg-surface-alt focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring">&lsaquo;</button>
<span class="text-sm font-bold text-text w-12 text-center">{{ $year }}</span>
<button wire:click="setYear({{ $year + 1 }})" aria-label="Année suivante" class="w-8 h-8 flex items-center justify-center rounded-full text-text-muted hover:bg-surface-alt focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring">&rsaquo;</button>
</div>
</div>
@@ -18,9 +18,9 @@
@foreach ($types as $type)
@php $section = $sections[$type->value]; @endphp
<div class="bg-surface shadow rounded-lg overflow-hidden">
<div class="{{ $colors[$type->value]['bg'] }} px-4 py-2">
<h2 class="text-white font-semibold">{{ $type->label() }}</h2>
<div class="bg-surface shadow rounded-3xl overflow-hidden">
<div class="{{ $colors[$type->value]['bg'] }} px-5 py-2.5">
<h2 class="text-white font-bold">{{ $type->label() }}</h2>
</div>
<div class="p-2">