use a separate circle in the progress svg for indefinite progress. fixes #771

This commit is contained in:
Danny Coates 2018-02-28 08:57:35 -08:00
parent a2aca89550
commit 2de5378208
No known key found for this signature in database
GPG Key ID: 4C442633C62E00CB
2 changed files with 14 additions and 1 deletions

View File

@ -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}"

View File

@ -37,3 +37,7 @@
line-height: 58px;
user-select: none;
}
.progress--invisible {
display: none;
}