1
1
@import ' ../core/style/variables' ;
2
2
3
3
4
- // Animation Durations
4
+ // Animation Durations
5
5
$md-progress-circle-duration : 5250ms !default ;
6
6
$md-progress-circle-constant-rotate-duration : $md-progress-circle-duration * 0.55 !default ;
7
7
$md-progress-circle-sporadic-rotate-duration : $md-progress-circle-duration !default ;
8
8
9
- // Component sizing
9
+ // Component sizing
10
10
$md-progress-circle-stroke-width : 10px !default ;
11
11
// Height and weight of the viewport for md-progress-circle.
12
12
$md-progress-circle-viewport-size : 100px !default ;
@@ -18,6 +18,7 @@ $md-progress-circle-viewport-size: 100px !default;
18
18
// The height and width are expected to be overwritten by application css.
19
19
height : $md-progress-circle-viewport-size ;
20
20
width : $md-progress-circle-viewport-size ;
21
+ overflow : hidden ;
21
22
22
23
// SVG's viewBox is defined as 0 0 100 100, this means that all SVG children will placed
23
24
// based on a 100px by 100px box. Additionally all SVG sizes and locations are in reference to
@@ -37,7 +38,7 @@ $md-progress-circle-viewport-size: 100px !default;
37
38
}
38
39
39
40
40
- & [mode = ' indeterminate' ] {
41
+ & [mode = ' indeterminate' ] svg {
41
42
animation-duration : $md-progress-circle-sporadic-rotate-duration ,
42
43
$md-progress-circle-constant-rotate-duration ;
43
44
animation-name : md- progress- circle- sporadic- rotate,
@@ -50,7 +51,7 @@ $md-progress-circle-viewport-size: 100px !default;
50
51
}
51
52
52
53
53
- // Animations for indeterminate mode
54
+ // Animations for indeterminate mode
54
55
@keyframes md-progress-circle-linear-rotate {
55
56
0% { transform : rotate (0deg ); }
56
57
100% { transform : rotate (360deg ); }
0 commit comments