feat: brand color system + Kanban view (admin + client)

- Fix button contrast: add all missing shadcn tokens (primary-foreground,
  ring, input, muted, destructive) aligned to iamcavalli brand
- NavBar: #1A463C green bar with white text
- Login page: clean brand layout with iamcavalli wordmark
- Admin pages: brand colors on headings, borders, links
- Admin ClientRow: semantic payment badges (green/yellow/red)
- Admin phases tab: Lista ↔ Kanban toggle with @dnd-kit drag & drop
  between Da fare / In corso / Fatto columns (optimistic updates)
- Client dashboard: Timeline ↔ Kanban toggle, expandable task cards
  with approve button + comment form inline

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Simone Cavalli
2026-05-15 23:14:29 +02:00
parent 80d93993a9
commit 7af917fe80
13 changed files with 684 additions and 50 deletions
+47 -15
View File
@@ -4,28 +4,60 @@
@source not "../../scripts/**";
/* =========================================================
Design tokens — light & clean palette (Tailwind v4 @theme)
Design tokens — iamcavalli brand palette (Tailwind v4 @theme)
========================================================= */
@theme inline {
/* Colori base */
--color-background: #ffffff;
--color-foreground: #171717;
/* Font */
--font-sans: var(--font-geist-sans), system-ui, -apple-system, BlinkMacSystemFont,
"Segoe UI", Roboto, "Helvetica Neue", sans-serif;
--font-mono: var(--font-geist-mono);
/* Palette brand iamcavalli — light & clean */
--color-primary: #1a1a1a; /* charcoal per testo principale */
--color-secondary: #666666; /* grigio medio per testo secondario */
--color-tertiary: #999999; /* grigio chiaro per hint e timestamp */
--color-bg-subtle: #f9f9f9; /* grigio molto chiaro per sfondi sezione */
--color-border-light: #e5e5e5; /* bordo sottile */
--color-accent: #0066cc; /* blu accent */
--color-success: #16a34a; /* verde per done/saldato */
--color-warning: #ca8a04; /* giallo per in_progress/inviata */
--color-info: #2563eb; /* blu per pending/da_saldare */
/* Base */
--color-background: #ffffff;
--color-foreground: #1a1a1a;
/* Brand primary — verde scuro iamcavalli */
--color-primary: #1A463C;
--color-primary-foreground: #ffffff;
/* Brand accent — giallo lime */
--color-accent: #DEF168;
--color-accent-foreground: #1A463C;
/* Secondary — grigio neutro */
--color-secondary: #f4f4f5;
--color-secondary-foreground: #1a1a1a;
/* Muted — per testi e sfondi secondari */
--color-muted: #f9f9f9;
--color-muted-foreground: #71717a;
/* Destructive */
--color-destructive: #ef4444;
--color-destructive-foreground: #ffffff;
/* Card */
--color-card: #ffffff;
--color-card-foreground: #1a1a1a;
/* Popover */
--color-popover: #ffffff;
--color-popover-foreground: #1a1a1a;
/* Border / Input / Ring */
--color-border: #e5e7eb;
--color-input: #e5e7eb;
--color-ring: #1A463C;
/* Semantic — stato task/pagamenti */
--color-success: #16a34a;
--color-warning: #ca8a04;
--color-info: #2563eb;
/* Legacy — usati inline nei componenti esistenti */
--color-tertiary: #999999;
--color-bg-subtle: #f9f9f9;
--color-border-light: #e5e5e5;
}
/* =========================================================