Fixing Case Progress SVG issues on Firefox
This commit is contained in:
parent
14b54a831b
commit
02349447d6
@ -26,14 +26,14 @@
|
||||
</circle>
|
||||
{{/unless}}
|
||||
</svg>
|
||||
<div class="progressText">
|
||||
<div class="progressArea {{#if isLocked}}locked{{else}}{{#if progressComplete}}complete{{/if}}{{/if}}">
|
||||
{{#if isLocked}}
|
||||
<svg class="locked">
|
||||
<svg>
|
||||
<use xlink:href={{absoluteUrl "packages/ohif_viewerbase/assets/icons.svg#icon-status-lock"}}></use>
|
||||
</svg>
|
||||
{{else}}
|
||||
{{#if progressComplete}}
|
||||
<svg class="complete">
|
||||
<svg>
|
||||
<use xlink:href={{absoluteUrl "packages/ohif_viewerbase/assets/icons.svg#icon-status-complete"}}></use>
|
||||
</svg>
|
||||
{{else}}
|
||||
|
||||
@ -20,29 +20,33 @@ $circleSize = 46px
|
||||
vendorize(transform, rotate(270deg))
|
||||
vendorize(transform-origin, center center)
|
||||
|
||||
.progressText
|
||||
position: absolute
|
||||
width: $circleSize
|
||||
height: $circleSize
|
||||
line-height: $circleSize
|
||||
.progressArea
|
||||
theme('color', '$activeColor')
|
||||
display: table
|
||||
font-weight: 700
|
||||
font-size: 17px
|
||||
text-align: center
|
||||
theme('color', '$activeColor')
|
||||
top: 0
|
||||
height: $circleSize
|
||||
line-height: $circleSize
|
||||
left: 50%
|
||||
position: absolute
|
||||
top: 50%
|
||||
transform(translate(-50%, -50%))
|
||||
width: $circleSize
|
||||
|
||||
&.locked
|
||||
line-height: 0
|
||||
|
||||
&, & svg
|
||||
height: 21px
|
||||
width: 16px
|
||||
|
||||
&.complete
|
||||
line-height: 0
|
||||
|
||||
&, & svg
|
||||
height: 27px
|
||||
width: 27px
|
||||
|
||||
svg
|
||||
theme('fill', '$activeColor')
|
||||
left: 50%
|
||||
position: absolute
|
||||
theme('stroke', '$activeColor')
|
||||
top: 50%
|
||||
transform(translateX(-50%) translateY(-50%))
|
||||
|
||||
&.locked
|
||||
width: 16px
|
||||
height: 21px
|
||||
|
||||
&.complete
|
||||
width: 27px
|
||||
height: 27px
|
||||
|
||||
Loading…
Reference in New Issue
Block a user