jeremy/suivicpt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Apply Finlio cream/terracotta design system

Browse Source 
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
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/livewire/dashboard/index.blade.php
+17 -17
View File
@@ -1,18 +1,18 @@
<div class="max-w-7xl mx-auto py-6 px-4 sm:px-6 space-y-6">
<div class="flex flex-wrap items-center justify-between gap-4">
<h1 class="text-xl font-semibold text-text">Tableau de bord</h1>
<div class="flex items-center gap-3">
<h1 class="text-3xl font-display text-text">Tableau de bord</h1>
<div class="flex items-center gap-2">
<div>
<label for="dashboard-year" class="text-xs text-text-muted">Année</label>
<select id="dashboard-year" wire:model.live="year" class="block rounded-md bg-surface border-border-strong text-text text-sm focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring">
<label for="dashboard-year" class="sr-only">Année</label>
<select id="dashboard-year" wire:model.live="year" class="block rounded-full bg-surface border-border-strong text-text text-sm px-4 py-2 focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring">
@foreach (range($year - 3, $year + 3) as $y)
<option value="{{ $y }}">{{ $y }}</option>
@endforeach
</select>
</div>
<div>
<label for="dashboard-period" class="text-xs text-text-muted">Période</label>
<select id="dashboard-period" wire:model.live="period" class="block rounded-md bg-surface border-border-strong text-text text-sm focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring">
<label for="dashboard-period" class="sr-only">Période</label>
<select id="dashboard-period" wire:model.live="period" class="block rounded-full bg-surface border-border-strong text-text text-sm px-4 py-2 focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring">
<option value="year">Année complète</option>
@foreach (['Janvier','Février','Mars','Avril','Mai','Juin','Juillet','Août','Septembre','Octobre','Novembre','Décembre'] as $i => $label)
<option value="{{ $i + 1 }}">{{ $label }}</option>
@@ -22,9 +22,9 @@
</div>
</div>
<div class="bg-surface shadow rounded-lg p-4 max-w-xs">
<p class="text-xs text-text-muted">Reste à dépenser</p>
<p class="mt-1 text-lg font-semibold text-negative">{{ number_format($sections['depense']['totals']['reste'], 2, ',', ' ') }} €</p>
<div class="bg-surface shadow rounded-3xl px-6 py-5 inline-flex flex-col gap-1">
<p class="text-xs text-text-muted uppercase tracking-wide">Reste à dépenser</p>
<p class="font-display text-2xl text-negative">{{ number_format($sections['depense']['totals']['reste'], 2, ',', ' ') }} €</p>
</div>
@php
@@ -44,16 +44,16 @@
@endphp
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="bg-surface shadow rounded-lg overflow-hidden">
<div class="px-4 py-2 bg-text">
<h2 class="text-surface font-semibold text-sm">Analyse</h2>
<div class="bg-surface shadow rounded-3xl overflow-hidden">
<div class="px-5 pt-4 pb-1">
<h2 class="font-semibold text-base text-text">Analyse</h2>
</div>
<div class="divide-y divide-border">
@foreach ($types as $type)
@php $section = $sections[$type->value]; @endphp
<div>
<div class="{{ $colors[$type->value]['bg'] }} px-4 py-1.5">
<h3 class="text-white text-sm font-medium">{{ $type->label() }}</h3>
<div class="px-5 pb-5">
<div class="{{ $colors[$type->value]['bg'] }} px-4 py-2 rounded-2xl mb-2">
<h3 class="text-white text-sm font-bold">{{ $type->label() }}</h3>
</div>
<div class="overflow-x-auto">
<table class="min-w-full text-sm">
@@ -110,8 +110,8 @@
<div class="space-y-6">
@foreach ($types as $type)
@php $top = $chartData[$type->value]; @endphp
<div class="bg-surface shadow rounded-lg p-4">
<h3 class="text-sm font-medium mb-2 text-text">Catégorie de <span class="{{ $type->value === 'revenu' ? 'text-positive' : ($type->value === 'depense' ? 'text-negative' : 'text-info') }}">{{ Str::lower($type->label()) }}</span> (suivis)</h3>
<div class="bg-surface shadow rounded-3xl p-5">
<h3 class="text-sm font-semibold mb-4 text-text">Catégorie de <span class="{{ $type->value === 'revenu' ? 'text-positive' : ($type->value === 'depense' ? 'text-negative' : 'text-info') }}">{{ Str::lower($type->label()) }}</span> (suivis)</h3>
@if ($top['labels']->isEmpty())
<p class="text-xs text-text-muted py-8 text-center">Aucun montant suivi.</p>