Skip to content

Commit d263ca2

Browse files
crisbetojelbourn
authored andcommitted
fix(radio): animation looking off on IE (#5620)
Fixes the radio button checked animation looking off on IE. The issue comes the fact that IE renders the entire circle for a couple of frames before starting the animation.
1 parent 7e8234b commit d263ca2

File tree

1 file changed

+4
-1
lines changed

1 file changed

+4
-1
lines changed

src/lib/radio/radio.scss

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,9 +54,12 @@ $mat-radio-ripple-size: $mat-radio-size * 0.75;
5454
position: absolute;
5555
top: 0;
5656
transition: transform ease 280ms, background-color ease 280ms;
57-
transform: scale(0);
5857
width: $mat-radio-size;
5958

59+
// Note: This starts from 0.001 instead of 0, because transitioning from 0 to 0.5 causes
60+
// IE to flash the entire circle for a couple of frames, throwing off the entire animation.
61+
transform: scale(0.001);
62+
6063
.mat-radio-checked & {
6164
transform: scale(0.5);
6265
}

0 commit comments

Comments
 (0)