Foundation - Progress Bar SASS Reference
Descripción
Puede cambiar los estilos de los componentes utilizando SASS Reference.
Variables
La siguiente tabla enumera las variables SASS en el archivo de configuración del proyecto que hace que los estilos predeterminados de este componente se personalicen.
| No Señor. | Nombre y descripción | Tipo | Valor por defecto |
|---|---|---|---|
| 1 | $progress-height Representa la altura de la barra de progreso. |
Número | 1rem |
| 2 | $progress-background Representa el color de fondo de la barra de progreso. |
Color | $ gris medio |
| 3 | $progress-margin-bottom Representa el margen inferior de la barra de progreso. |
Número | $ margen-global |
| 4 | $progress-meter-background Representa el color predeterminado del medidor de la barra de progreso. |
Color | $ color primario |
| 5 | $progress-radius Representa el radio de la barra de progreso predeterminada. |
Número | $ radio-global |
Mixins
Para construir la salida CSS final de este componente, se pueden usar los siguientes mixins. Para construir su propia estructura de clases usando componentes Foundation, puede usar los mixins usted mismo.
contenedor de progreso
@include progress-container;Agrega estilos al contenedor de la barra de progreso.
medidor de progreso
@include progress-meter;Agrega estilos al medidor interno de la barra de progreso.
texto-medidor-de-progreso
@include progress-meter-text;Agrega estilos al texto en metros de la barra de progreso.