[Breaking change] Refactor dossier styles : design tokens

[raphpare]

Description

Restructuration majeur des fichiers du dossier src/styles pour facilité l'importation de styles sur demande.

Changements SCSS

Renommage de nom de mixins SCSS

Ancien nom	Nouveau nom
m-title-styles	m-heading-styles
m-commons-title-styles	m-commons-heading-styles
m-var-color	m-css-color-tokens
m-all-custom-properties	m-css-design-tokens

Renommage de nom d'animation @keyframe

Ancien nom	Nouveau nom
indeterminate	m-indeterminate
indeterminate-short	m-indeterminate-short

Variables SCSS remplacées

Ancien nom	Nouveau nom
$m-font-path	$m-font-root-path

Fichiers remplacés

Ancien fichier	Nouveau fichier
/styles/variables/_media-queries.scss	/styles/tokens/layout/_breakpoints.scss

Nouveaux fichiers

Nom de fichier
/styles/app-root.scss
/styles/css-design-tokens.scss
/styles/root/_app-root.scss
/styles/tokens/*
/styles/utils/compoents/*
/styles/utils/layout/*
/styles/utils/typographies/*

Lire ces fichier README.md

• /styles/README.md
• /styles/utils/README.md

Changement pour la classe .mu-link et .mu-link__text

Implémentation HTML d'un lien standard

Ancien balisage

<a class="mu-link" href="#">
    <span class="mu-link__text">Étiquette</span>
</a>

Nouveau balisage

<a class="mu-link" href="#">
    Étiquette
</a>

Implémentation HTML d'un lien avec une icone

Ancien balisage

<a class="mu-link" href="#">
    <svg>...</svg>
    <span class="mu-link__text">Étiquette</span>
</a>

Nouveau balisage

Ajout de la classe mu-link-icon. Pour obtenir un lien surligné sur l'état de survol et focus, il faut ajout un <span> avec la classe mu-link__text.

<a class="mu-link-icon" href="#">
    <svg>...</svg>
    <span class="mu-link__text">Étiquette</span>
</a>