UI-Kit
Les titres
Exemple de titre : .page-title
Les Typos
Exemple de titre H1
Font Family
Oswald
Font Weight
700 (Bold)
Font Size
60px (34px mobile)
CSS Class
.h1
Exemple de titre H2
Font Family
Oswald
Font Weight
500 (Medium)
Font Size
32px (28px mobile)
CSS Class
.h2
Exemple de titre H3
Font Family
Oswald
Font Weight
500 (Medium)
Font Size
20px
CSS Class
.h3
Exemple de CTA
Font Family
Rubik
Font Weight
500 (Medium)
Font Size
18px
CSS Class
.cta
Exemple de texte body large
Font Family
DM Sans
Font Weight
400 (Regular)
Font Size
18px
CSS Class
.body-large
Exemple de texte body large strong
Font Family
DM Sans
Font Weight
600 (Semibold)
Font Size
18px
CSS Class
.body-large-strong
Exemple de texte body small
Font Family
DM Sans
Font Weight
400 (Regular)
Font Size
16px
CSS Class
.body-small
Exemple de texte body small strong
Font Family
DM Sans
Font Weight
600 (Semibold)
Font Size
16px
CSS Class
.body-small-strong
Les Couleurs
Dark
#031239
Texte principal, headers
White
#FFFFFF
Arrière-plans, texte inversé
Neutral
#FBFCFE
Arrière-plan léger
Secondary 1
#2482B2
Boutons primaires, accents
Secondary 2
#111514
Boutons secondaires, liens
Secondary 3
#F1F2F6
Arrière-plans subtils
Les Boutons
Classes utilitaires pour les boutons
Les Icons
Comment utiliser un icône
{{ svg_icon('icon_name') }}Remplacez icon_name par le nom de l'icône souhaité
Liste des icônes disponibles
Les Cards
Cards Post
{{ include('cards/post.twig', {'post':post}) }}