angular / angular/components

[Mat-Form-Field] label/placeholder shake animation on input error

Offen
#16,634 4 Kommentare 3 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
area: material/form-field feature P4
Vorherrschende Sprache
TypeScript
Sterne
25k
Forks
6.8k
Ø Merge
1 T. 8 Std.
Gemergte PRs (30 T.)
91

Beschreibung

#### Feature Description

See the example in the official docs:
- [Material Design - Text Fields - Anatomy](https://material.io/design/components/text-fields.html#anatomy) > Assistive Elements > Error Text
- [Direct link to video example](https://storage.googleapis.com/spec-host/mio-staging%2Fmio-design%2F1563837804615%2Fassets%2F1-aJCEgnpvxTuvtYshKU7BuVV4EdPatjE%2Ftextfields-anatomy-error.mp4)

In a form field, on error, the label/placeholder lightly shakes (left and right) as it turns red.

#### Use Case

This will enhance form field UX by subtly grabbing user attention for errors during form field entry

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Es werden keine Implementierungsdateien oder Tests genannt. Beginne damit, die Angular Material form-field-Komponente zu finden, und reproduziere ihren Fehlerzustand, während du ihn mit dem verknüpften Material Design-Beispiel vergleichst; fertig ist es, wenn das Label oder der Platzhalter beim Rotwerden leicht nach links und rechts wackelt.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
angular, typescript
Bereich
design, frontend
Issue-Typ
Feature
Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.