Family

Tableau de synthèses des typos présentes sur le projet :

.ff1 Montserrat $font-family-base

Variante	Graissage	`.ff1`
Thin	`100`
ExtraLight	`200`
Light	`300`
Regular	`400`	Lorem ipsum dolor sit amet
Medium	`500`
SemiBold	`600`
Bold	`700`	Lorem ipsum dolor sit amet
ExtraBold	`800`	Lorem ipsum dolor sit amet
Black	`900`

Il faut établir et disposer d'une grille de possibilités de tailles afin de garantir la cohérence graphique et la simplicité de mise en oeuvre de tout nouvel élément.
La neutralisation des variables via des tailles de t-shirt permet de cataloguer les tailles disponibles (de xxx-s à xxx-l).

Size

Taille de base du site : 16px $font-size-base

Variable / Mixin	Size (px)	`.ff1` 400/700	Heading		Body
Variable / Mixin	Size (px)	`.ff1` 400/700	D	M	Body
`fs-xxxs`	10px	Lorem ipsum		`.t6`	X
`fs-xxs`	12px	Lorem ipsum		`.t5`	X
`fs-xs`	14px	Lorem ipsum	`.t6`	`.t4`	X
`fs-s`	`16px`	Lorem ipsum	`.t5`	`.t3`	X
`fs-m`	20px	Lorem ipsum	`.t4`	`.t2`	X
`fs-l`	24px	Lorem ipsum	`.t3`	`.t1`
`fs-xl`	32px	Lorem ipsum	`.t2`
`fs-xxl`	40px	Lorem ipsum	`.t1`
`fs-xxxl`	56px	Lorem ipsum

Wording de base

Base

Taille de base du site : 16px.

Texte normal / Texte en gras / Texte plus gros / Texte plus petit / Texte petit et italique / Lorem ipsum^{texte en exposant} / lien de base / highlight.

Paragraphe

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce cursus dolor nec fermentum volutpat. Praesent vehicula orci nec urna fermentum convallis. Mauris eu luctus orci. Aliquam erat volutpat. Sed fringilla finibus purus, at pharetra dui euismod eu. Sed bibendum, mauris eget rutrum viverra, leo erat volutpat ipsum, ac aliquet lorem ligula ut tellus. Nullam pulvinar, neque quis posuere eleifend, elit est blandit diam, nec sagittis risus turpis eu ligula.

Nullam a ante faucibus, imperdiet nisl ac, eleifend arcu. Praesent ac odio a augue sodales tristique. Praesent eget mollis ipsum. Curabitur ullamcorper massa vel dui venenatis rutrum in a ligula. Aenean sit amet nisi nisi. Cras volutpat convallis arcu a pellentesque. In luctus placerat pretium.

Liste

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Quisque laoreet magna vitae nibh rutrum finibus.
Morbi eleifend lorem in interdum volutpat.
Vestibulum eu nisl eget ex euismod faucibus id sed lectus.

Headings

t1 La qualité pour tous