Formularios
Permite elegir un valor numérico dentro de un rango arrastrando un mando. Es apropiado cuando el rango es amplio y el valor exacto importa menos que la posición relativa; si el rango es corto y el valor exacto sí importa, el stepper es la alternativa.
<vadavo-slider> genera su propio input type="range" dentro de su shadow root y participa en FormData como un campo nativo. Acepta los atributos min, max, step, value y disabled; sin value, arranca en el punto medio del rango.
El componente actualiza --slider--size--progress en cada evento input para pintar la parte rellena de la pista.
<vadavo-slider name="volume" min="0" max="100" value="40"></vadavo-slider>| Token | Qué es |
|---|---|
--slider--background--thumb | El color de fondo del mando del deslizador. |
--slider--background--thumb-active | El color de fondo del mando mientras se arrastra. |
--slider--shadow--thumb | La sombra del mando del deslizador. |
--slider--shadow--focus-ring | El anillo (box-shadow) que rodea al mando del deslizador cuando tiene el foco. |
--slider--border-width--thumb-ring | El grosor del anillo claro que rodea al mando del deslizador. |
--slider--border-style--thumb-ring | El tipo (border-style) del anillo claro que rodea al mando del deslizador. |