Fondation - Fil d'Ariane de navigation
La description
Un fil d'Ariane spécifie l'emplacement actuel d'un site dans la hiérarchie de navigation. Il est utile lors de l'accès à un grand nombre de pages d'un site Web. Un fil d'Ariane dans Foundation est simplement une liste non ordonnée avec une classe de .breadcrumb . Pour des informations détaillées, consultez ce chapitre .
Référence SASS
Variables
Vous pouvez modifier les styles des composants à l'aide des variables SASS suivantes, comme indiqué dans le tableau.
| N ° Sr. | Nom et description | Type | Valeur par défaut |
|---|---|---|---|
| 1 | $breadcrumbs-margin Autour du conteneur de fil d'Ariane, la marge est définie. |
Nombre | 0 0 $ marge globale 0 |
| 2 | $breadcrumbs-item-font-size Définit la taille de la police pour l'élément de fil d'Ariane. |
Nombre | rem-calc (11) |
| 3 | $breadcrumbs-item-color Définit la couleur de l'élément de fil d'Ariane. |
Couleur | $ couleur primaire |
| 4 | $breadcrumbs-item-color-current Définit la couleur de l'élément de fil d'Ariane actuel. | Couleur | $ noir |
| 5 | $breadcrumbs-item-color-disabled L'élément de fil d'Ariane est désactivé. |
Nombre | $ gris moyen |
| 6 | $breadcrumbs-item-margin Définit la marge entre les éléments de fil d'Ariane. |
Nombre | 0,75rem |
| sept | $breadcrumbs-item-uppercase Rend l'élément de fil d'Ariane en majuscules. |
Booléen | vrai |
| 8 | $breadcrumbs-item-slash Inclut une barre oblique entre les éléments de fil d'Ariane. |
Booléen | vrai |
Mixin
Vous pouvez utiliser les mixins pour créer la structure de classe CSS pour vos composants comme indiqué dans le tableau -
chapelure-contenant
Il inclut des styles pour le conteneur de fil d'Ariane avec le style de l'élément <li> <a> présent à l'intérieur.
@include breadcrumbs-container;