Skip to content

Commit 4d60f90

Browse files
crisbetoannieyw
authored andcommitted
fix(material-experimental/mdc-progress-spinner): indeterminate animation not working (#21391)
Seems like a regression from #21359. We can't use `:not` to apply the animation styles, because MDC's mixins target `.mdc-progress-spinner`, rather than `&`. These changes use the same manual approach as other components to disable the animations. (cherry picked from commit 37a9c4e)
1 parent 4134580 commit 4d60f90

File tree

1 file changed

+18
-8
lines changed

1 file changed

+18
-8
lines changed
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,28 @@
11
@import '@material/circular-progress/mixins.import';
22
@import '../mdc-helpers/mdc-helpers';
33

4-
@include mdc-circular-progress-core-styles($query: $mat-base-styles-without-animation-query);
4+
@include mdc-circular-progress-core-styles($query: $mat-base-styles-query);
55

66
.mat-mdc-progress-spinner {
77
// Prevents the spinning of the inner element from affecting layout outside of the spinner.
88
overflow: hidden;
9-
}
109

11-
.mat-mdc-progress-spinner:not(._mat-animation-noopable) {
12-
@include mdc-circular-progress-core-styles($query: animation);
13-
}
10+
&._mat-animation-noopable {
11+
&, .mdc-circular-progress__determinate-circle {
12+
// The spinner itself has a transition on `opacity`.
13+
transition: none;
14+
}
15+
16+
.mdc-circular-progress__indeterminate-circle-graphic,
17+
.mdc-circular-progress__spinner-layer,
18+
.mdc-circular-progress__indeterminate-container {
19+
// Disables the rotation animations.
20+
animation: none;
21+
}
1422

15-
// Render the indeterminate spinner as a complete circle when animations are off
16-
._mat-animation-noopable .mdc-circular-progress__indeterminate-container circle {
17-
stroke-dasharray: 0 !important;
23+
.mdc-circular-progress__indeterminate-container circle {
24+
// Render the indeterminate spinner as a complete circle when animations are off
25+
stroke-dasharray: 0 !important;
26+
}
27+
}
1828
}

0 commit comments

Comments
 (0)