STYLE GUIDE

Guide de style complet avec tous les composants UI disponibles et leurs variantes

Buttons

Variantes

Tailles

États

Inputs

Types

Avec erreur

Ce champ est requis

Textarea

Basique

Avec compteur de caractères

0/500 caractères

Avec erreur

Ce champ est requis

Select

Basique

Sans label

Avec erreur

Veuillez sélectionner une option

Disabled

Badges

Variantes

DefaultSuccessWarningDangerInfo

Tailles

Extra SmallSmallMedium

Alerts

Opération réussie ! Votre action a été effectuée avec succès.
Une erreur est survenue. Veuillez réessayer.
Attention ! Cette action est irréversible.
Information : Voici quelques informations utiles.

Cards

Card Default

Contenu de la carte avec variant default

Card Dark

Contenu de la carte avec variant dark

Progress Bars

HP Bar (High)

HP75 / 100

HP Bar (Medium)

HP45 / 100

HP Bar (Low)

HP20 / 100

XP Bar

XP60 / 100

Default

Progress50 / 100

Sans label

Star Rating

Interactif

Note sélectionnée : 0/5

Tailles

Small

Medium

Large

Avatar

Tailles

User
User
User

Sans image (fallback)

J

Section Title

Variantes

Default Title

Gradient Title

Tailles

Small Title

Medium Title

Large Title

Extra Large Title

Avec sous-titre

Title with Subtitle

Un sous-titre descriptif

Modal

Tailles

Close Button

Tailles

Disabled