Foundation - Progress Bar Référence SASS
La description
Vous pouvez modifier les styles des composants à l'aide de la référence SASS.
Variables
Le tableau suivant répertorie les variables SASS du fichier de paramètres du projet qui permettent de personnaliser les styles par défaut de ce composant.
| N ° Sr. | Nom et description | Type | Valeur par défaut |
|---|---|---|---|
| 1 |
$progress-height Il représente la hauteur de la barre de progression. |
Nombre | 1rem |
| 2 |
$progress-background Il représente la couleur d'arrière-plan de la barre de progression. |
Couleur | $ gris moyen |
| 3 |
$progress-margin-bottom Il représente la marge inférieure de la barre de progression. |
Nombre | marge globale $ |
| 4 |
$progress-meter-background Il représente la couleur par défaut du compteur de la barre de progression. |
Couleur | $ couleur primaire |
| 5 |
$progress-radius Il représente le rayon de la barre de progression par défaut. |
Nombre | $ global-radius |
Mixins
Pour créer la sortie CSS finale de ce composant, les mixins suivants peuvent être utilisés. Pour créer votre propre structure de classe à l'aide des composants Foundation, vous pouvez utiliser les mixins vous-même.
progress-container
@include progress-container;Il ajoute des styles au conteneur de la barre de progression.
progrès-mètre
@include progress-meter;Il ajoute des styles à l'indicateur interne de la barre de progression.
progress-meter-text
@include progress-meter-text;Il ajoute des styles au texte en mètre de la barre de progression.