CUBE CSS

Definition

Méthodologie Composition-Utility-Block-Exception qui embrasse la cascade CSS. Utilise les compositions pour le layout, les utilities pour les tokens, les blocks pour les composants, et les exceptions pour les variantes.

Analogie

Comme un architecte qui planifie les pièces (composition), choisit les matériaux (utilities), meuble chaque pièce (blocks) et ajuste les détails (exceptions).

Exemple de code

/* Composition : layout */
.flow > * + * { margin-top: var(--flow-space); }
/* Utility : token */
.text-primary { color: var(--primary); }
/* Block : composant */
.card { /* styles spécifiques */ }
/* Exception */
.card[data-variant='featured'] { /* override */ }

Cas d'usage

Projets qui veulent tirer parti de la cascade CSS plutôt que la combattre.

Termes lies