style: rifinitura Quiet Luxury dashboard — bordi soft, badge, colori

Allinea la dashboard alla rifinitura del mock (finezza bordi/colori/badge):

- Card su border-border-light (slate-100) per il bordo sottile
- KPI: valore verde su Incassato Reale, delta verde "+N questo mese" su
  Clienti Attivi (nuova metrica getDashboardStats.clientiNuoviMese)
- Redditività: badge "Ottimo" con tint emerald soft (non brand primary)
- Follow-up: righe come box bordati (no avatar), link "Apri →" primary
- Forecast: selettore anno (pill interattiva) spostato nell'header della card,
  barre non-picco grigie (bg-border), rimosso il numero "mese prossimo"
- Offerte Più Richieste: rimossa la pill totale nell'header

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-07-11 12:18:10 +02:00
parent 08aadc1d97
commit a20a9de2d7
7 changed files with 95 additions and 129 deletions
+5 -10
View File
@@ -5,22 +5,17 @@ export function OffersSoldChart({ data }: { data: OffersSoldBreakdown }) {
if (data.rows.length === 0) {
return (
<div className="bg-card rounded-xl border border-border shadow-card p-8 text-center">
<div className="bg-card rounded-xl border border-border-light shadow-card p-8 text-center">
<p className="text-sm text-muted-foreground italic">Nessuna offerta venduta finora.</p>
</div>
);
}
return (
<div className="bg-card rounded-xl border border-border shadow-card p-5 space-y-4">
<div className="flex items-center justify-between">
<h3 className="text-xs font-bold uppercase tracking-wider text-muted-foreground">
Offerte Più Richieste
</h3>
<span className="inline-flex items-center justify-center min-w-[24px] h-6 px-2 rounded-full bg-primary text-primary-foreground text-xs font-bold font-mono">
{data.total}
</span>
</div>
<div className="bg-card rounded-xl border border-border-light shadow-card p-5 space-y-4">
<h3 className="text-xs font-bold uppercase tracking-wider text-muted-foreground">
Offerte Più Richieste
</h3>
<div className="space-y-4">
{data.rows.map((row, i) => {
const pct = Math.round((row.count / max) * 100);