MatStepper: Step header focus treatment is not strong enough
- Vorherrschende Sprache
- TypeScript
- Sterne
- 25k
- Forks
- 6.8k
- Ø Merge
- 1 T. 8 Std.
- Gemergte PRs (30 T.)
- 91
Beschreibung
#### Reproduction
Open any example with Stepper material component:
https://material.angular.io/components/stepper/overview
Focus on it and check background color for active state (rgba(0,0,0, .04))
For white background it's #f5f5f5
https://webaim.org/resources/contrastchecker/?fcolor=F5F5F5&bcolor=FFFFFF
#### Expected Behavior
Color contrast between background for focus state and page background will be at least 3:1
#### Actual Behavior
Color contrast is 1.09:1
Beitragsleitfaden
Rechercherichtung
Öffne das Beispiel der Stepper Material-Komponente unter https://material.angular.io/components/stepper/overview und reproduziere den Fokuszustand auf einem Step-Header. Verwende den verlinkten WebAIM-Kontrastprüfer, um das aktuelle Verhältnis zu überprüfen, aktualisiere dann die Fokusdarstellung, sodass der Kontrast zwischen Hintergrund und Seite mindestens 3:1 erreicht, und überprüfe das Beispiel visuell.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Bewertung
- Tech-Stack
- angular, typescript
- Bereich
- accessibility, frontend
- Issue-Typ
- Bug
- Schwierigkeit
- 2/5
- Geschätzter Aufwand
- 1-3 Stunden
- Aktivitätsstatus
- Veraltet
- Klarheit
- Klar beschrieben
- Anfängerfreundlichkeit
- 45/100