-
Notifications
You must be signed in to change notification settings - Fork 2.1k
fix(text-field): Apply error color on bottom line of fullwidth field #2197
Conversation
Codecov Report
@@ Coverage Diff @@
## master #2197 +/- ##
=======================================
Coverage 99.14% 99.14%
=======================================
Files 90 90
Lines 3842 3842
Branches 496 496
=======================================
Hits 3809 3809
Misses 33 33 Continue to review full report at Codecov.
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Alternate colors error line should be orange
@include mdc-text-field-fullwidth_; | ||
} | ||
|
||
.mdc-text-field--fullwidth.mdc-text-field--invalid { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
When the alternate colors class is added, the idle line is still red.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
FWIW I would point out that the alternate color class was never doing anything to the idle bottom line color for the fullwidth text field, so this might actually be a separate issue, but I'm looking into it a bit.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
So this seems like it was more of an oversight with the demo page than with these styles. I added styles to the demo page for the full-width custom color demo, and also fixed a style for the textfield custom color demo that seemed accidentally redundant (idle/focus used same opacity).
I suspect that those styles could be further cleaned up; I initially ended up confused as to where to put the styles for this specific part of the demo page, and realized that the demo-text-field-custom-colors
and demo-text-field-custom-error-colors
styles probably don't actually need separate CSS classes since they're always applied together to the same elements...
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
Also fixes typos in a couple of private mixins (asterix -> asterisk, full-width -> fullwidth for consistency with other mixins incl. a public one)
Observable using the required checkbox under the fullwidth examples at the end of text-field.html.
Fixes #2165.