use a separate circle in the progress svg for indefinite progress. fixes #771
This commit is contained in:
parent
a2aca89550
commit
2de5378208
|
@ -28,7 +28,16 @@ module.exports = function(progressRatio, indefinite = false) {
|
|||
cy="${oRadius}"
|
||||
fill="transparent"/>
|
||||
<circle
|
||||
class="${indefinite ? 'progress__indefinite' : 'progress__bar'}"
|
||||
class="progress__indefinite ${indefinite ? '' : 'progress--invisible'}"
|
||||
r="${radius}"
|
||||
cx="${oRadius}"
|
||||
cy="${oRadius}"
|
||||
fill="transparent"
|
||||
transform="rotate(-90 ${oRadius} ${oRadius})"
|
||||
stroke-dasharray="${circumference}"
|
||||
stroke-dashoffset="${dashOffset}"/>
|
||||
<circle
|
||||
class="progress__bar ${indefinite ? 'progress--invisible' : ''}"
|
||||
r="${radius}"
|
||||
cx="${oRadius}"
|
||||
cy="${oRadius}"
|
||||
|
|
|
@ -37,3 +37,7 @@
|
|||
line-height: 58px;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.progress--invisible {
|
||||
display: none;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue