feat(Slider): The Slider component should be able to properly display values with four or more digits
- Lenguaje dominante
- TypeScript
- Estrellas
- 25k
- Forks
- 6.8k
- Merge medio
- 1 d 8 h
- PR fusionados (30 d)
- 91
Descripción
### Feature Description
The [Slider component](https://material.angular.dev/components/slider/overview) cannot display values with four or more digits properly in the thumb label.
The issue can be quickly seen by sliding one of the example sliders in the documentation all the way up:
At four digits, the text already overflows the container. A year looks even worse:
While the custom thumb label formatting feature slightly helps with this, the limit for a slider that looks decent is just three-digit values.
Looking at [Material Design sliders](https://m3.material.io/components/sliders/overview), I can see that the thumb label is much wider, and it's easy to imagine it expanding horizontally to accomodate more text:
The design of the Angular Material slider actually resembles the older M2 design with the smaller label:
### Use Case
This will enable the slider to be used for a lot of common use cases like selecting a date range.
Guía de contribución
Línea de trabajo
Comienza con el componente Slider y los sliders de ejemplo de la documentación enlazada en el issue, reproduciendo el desbordamiento con valores de cuatro dígitos y un año. Compara el comportamiento de thumb-label con la referencia de sliders de Material Design; el trabajo estará terminado cuando los valores más largos se muestren correctamente sin desbordarse y los ejemplos documentados sigan siendo utilizables.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- angular, typescript
- Área
- design, frontend
- Tipo de issue
- Nueva funcionalidad
- Dificultad
- 3/5
- Tiempo estimado
- 1-2 días
- Estado de actividad
- Tranquilo
- Claridad
- Bastante claro
- Aptitud para principiantes
- 55/100