Files

T

Yugonito b6185cd127 init : tokens de marque et thème sémantique shadcn (direction dark tech + cyan)

- tokens.css : échelles fait-cyan (#16D5FF) et fait-gray (#545454) en oklch, statuts
- theme.css : variables sémantiques shadcn light/dark mappées sur les primitifs
- demo : page de validation de la direction visuelle

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

2026-07-06 23:18:28 +02:00

1.2 KiB

Raw Permalink Blame History

@forgetaboutit/ui

Design system Forget About IT — tokens de marque et thème sémantique pour les applications Tailwind v4 + shadcn/ui (fait-customers, leguidepourve, …).

Contenu

src/tokens.css — tokens primitifs : échelles fait-cyan (cyan logo #16D5FF) et fait-gray (anthracite logo #545454), couleurs de statut. Expose les utilitaires Tailwind (bg-fait-cyan-400, text-fait-gray-200, …).
src/theme.css — thème sémantique compatible shadcn/ui (--background, --primary, --sidebar, …) en light et dark. Direction : dark tech + cyan (dark = thème de référence).

Usage

Installer depuis le repo git :

npm install git+https://git.fabout.it/hcloez/forgetaboutit-ui.git

Puis dans le globals.css de l'app :

@import "tailwindcss";
@import "@forgetaboutit/ui/theme.css"; /* importe aussi tokens.css */

Les composants shadcn consomment automatiquement les variables sémantiques. Règles d'usage dans les apps :

Toujours les tokens sémantiques (text-foreground, bg-card, border-border) — jamais de couleur hardcodée (text-zinc-400, bg-[#16D5FF]).
Les primitifs fait-* sont réservés aux cas où le sémantique ne suffit pas (illustrations, dégradés, marketing).

1.2 KiB Raw Permalink Blame History

@forgetaboutit/ui

Contenu

Usage

1.2 KiB

Raw Permalink Blame History