Skip to content

Commit b5a768f

Browse files
crisbetojelbourn
authored andcommitted
fix(input): align caret color with spec (#8692)
Based on the text field spec (https://material.io/guidelines/components/text-fields.html), the input caret color should match the underline color.
1 parent 490b3b4 commit b5a768f

File tree

1 file changed

+14
-0
lines changed

1 file changed

+14
-0
lines changed

src/lib/input/_input-theme.scss

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,17 +6,31 @@
66

77

88
@mixin mat-input-theme($theme) {
9+
$primary: map-get($theme, primary);
10+
$accent: map-get($theme, accent);
11+
$warn: map-get($theme, warn);
912
$foreground: map-get($theme, foreground);
1013

1114
.mat-input-element:disabled {
1215
color: mat-color($foreground, disabled-text);
1316
}
1417

1518
.mat-input-element {
19+
caret-color: mat-color($primary);
20+
1621
@include input-placeholder {
1722
color: _mat-control-placeholder-color($theme);
1823
}
1924
}
25+
26+
.mat-accent .mat-input-element {
27+
caret-color: mat-color($accent);
28+
}
29+
30+
.mat-warn .mat-input-element,
31+
.mat-form-field-invalid .mat-input-element {
32+
caret-color: mat-color($warn);
33+
}
2034
}
2135

2236
@mixin mat-input-typography($config) {

0 commit comments

Comments
 (0)