Skip to content

Commit bdc5aa3

Browse files
crisbetowagnermaciel
authored andcommitted
fix(datepicker): remove red shadow from invalid range inputs in Firefox (#20489)
Firefox automatically adds a red `box-shadow` to invalid inputs. These changes remove it from the inner range inputs since their invalid state is shown through the `mat-form-field`. Fixes #20483. (cherry picked from commit 50eca15)
1 parent 7ec2ee5 commit bdc5aa3

File tree

1 file changed

+6
-0
lines changed

1 file changed

+6
-0
lines changed

src/material/datepicker/date-range-input.scss

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,12 @@ $mat-date-range-input-part-max-width: calc(50% - #{$mat-date-range-input-separat
5858
display: none;
5959
}
6060

61+
// Undo the red box-shadow glow added by Firefox on invalid inputs.
62+
// See https://developer.mozilla.org/en-US/docs/Web/CSS/:-moz-ui-invalid
63+
&:-moz-ui-invalid {
64+
box-shadow: none;
65+
}
66+
6167
@include input-placeholder {
6268
@include _mat-date-range-input-placeholder-transition(color);
6369
}

0 commit comments

Comments
 (0)