Design System

Une appellation ampoulée pour signifier une réflexion de mise en forme d'éléments réutilisables

Couleurs

La charte graphique de la maquette

Voir le menu

Typographie

L'affichage des titres et textes

Niveaux de titres

Heading h1

Heading h2

Heading h3

Heading h

Heading h5
Heading h6

Texte

Lorem Elsass ipsum météor amet risus, aliquam Salu bissame bredele hopla sed DNA, merci vielmols ftomi! lacus nullam réchime Coopé de Truchtersheim rossbolla mamsell leverwurscht Mauris messti de Bischheim mollis Gal. yeuh.

Id gal schnaps sagittis geïz in, jetz gehts los munster suspendisse Chulia Roberstau Pfourtz ! leo tchao bissame hopla purus senectus varius Morbi semper turpis nüdle rhoncus baeckeoffe hopla Wurschtsalad ullamcorper quam.

Boutons

Les différentes formes d'affichage des boutons

Cards

Un élément de type "card" inspirée du "Material Design" pour afficher des infos dans une interface dont l'ergonomie doit inciter à la manipuler comme une carte à jouer...

Verticales

  • Une "card" à jouer

    Un élément de type "card" inspirée du "Material Design" pour afficher des infos dans une interface dont l'ergonomie doit inciter à la manipuler comme une carte à jouer...

    VOIR
    Image de l'élément
  • Une "card" entièrement cliquable

    La card utilise un pseudo élément pour transformer le lien afin qu'il recouvre toute la surface de la "card"...

    + VOIR
    Image de l'élément
  • Une "card" entièrement cliquable

    La card utilise un pseudo élément pour transformer le lien afin qu'il recouvre toute la surface de la "card"...

    + VOIR
    Image de l'élément

Horizontales

  • Une "card" horizontale

    La card utilise un pseudo élément pour transformer le lien afin qu'il recouvre toute la surface de la "card"...

    Image de l'élément
  • Une "card" horizontale

    La card utilise un pseudo élément pour transformer le lien afin qu'il recouvre toute la surface de la "card"...

    Image de l'élément

Icônes

Les différentes icônes de l'interface sont basées sur la police d'icônes de Font Awesome