Button

Contexte

Les classes .btn doivent être utilisées sur les éléments button ou a ou input.
Les éléments a qui ont une action / fonctionnalité dans la page doivent avoir un role="button".

Boutons pleins

Format .btn-{contexte}

Exemple input et a :

Link

Boutons filaires

Format btn-outline-{famille}

Size

Format btn-sm et btn-lg.

Block

Permet d'occuper toute la largeur disponible. Nous utilisons ici le display Grid sur un conteneur.

Exemple de bouton qui change de comportement en fonction du device :

Etat actif

L'ajout de la classe active donnera un effet enfoncé au bouton.

Primary link Primary Link Active

Etat disabled

L'ajout de la classe disabled donnera un effet inactif au bouton.

Primary link Link

Link

Liens de base avec ou sans picto devant ou derrière.

Lorem ipsum

Lorem ipsum

Lorem ipsum

Configuration
Thème
Bases
Atomes
Molécules
Organismes
Projet GC
Projet KIOSQUE