feat: Add new border style options, including single-edge borders, to countdown trackers.
This commit is contained in:
parent
19fce22ec3
commit
dfc84d0626
4 changed files with 103 additions and 2 deletions
|
|
@ -105,6 +105,57 @@
|
|||
style="transition: stroke-dasharray 0.3s ease; opacity: 1;"></circle>
|
||||
{{/if}}
|
||||
{{else}}
|
||||
{{#if (eq ../borderStyle "edge")}}
|
||||
{{#if ../invertBorder}}
|
||||
{{#if (eq ../borderEdge "bottom")}}
|
||||
<line x1="1" y1="1" x2="1" y2="47" stroke="{{../borderColor}}" stroke-width="2"
|
||||
stroke-linecap="round" pathLength="100"
|
||||
stroke-dasharray="0 {{countdown.percentage}} {{countdown.pctRemaining}} 100"
|
||||
style="transition: stroke-dasharray 0.3s ease; opacity: 1;">
|
||||
</line>
|
||||
{{else if (eq ../borderEdge "top")}}
|
||||
<line x1="47" y1="1" x2="47" y2="47" stroke="{{../borderColor}}" stroke-width="2"
|
||||
stroke-linecap="round" pathLength="100"
|
||||
stroke-dasharray="0 {{countdown.percentage}} {{countdown.pctRemaining}} 100"
|
||||
style="transition: stroke-dasharray 0.3s ease; opacity: 1;">
|
||||
</line>
|
||||
{{else if (eq ../borderEdge "left")}}
|
||||
<line x1="1" y1="1" x2="47" y2="1" stroke="{{../borderColor}}" stroke-width="2"
|
||||
stroke-linecap="round" pathLength="100"
|
||||
stroke-dasharray="0 {{countdown.percentage}} {{countdown.pctRemaining}} 100"
|
||||
style="transition: stroke-dasharray 0.3s ease; opacity: 1;">
|
||||
</line>
|
||||
{{else if (eq ../borderEdge "right")}}
|
||||
<line x1="1" y1="47" x2="47" y2="47" stroke="{{../borderColor}}" stroke-width="2"
|
||||
stroke-linecap="round" pathLength="100"
|
||||
stroke-dasharray="0 {{countdown.percentage}} {{countdown.pctRemaining}} 100"
|
||||
style="transition: stroke-dasharray 0.3s ease; opacity: 1;">
|
||||
</line>
|
||||
{{/if}}
|
||||
{{else}}
|
||||
{{#if (eq ../borderEdge "bottom")}}
|
||||
<line x1="1" y1="1" x2="1" y2="47" stroke="{{../borderColor}}" stroke-width="2"
|
||||
stroke-linecap="round" pathLength="100" stroke-dasharray="{{countdown.percentage}} 100"
|
||||
style="transition: stroke-dasharray 0.3s ease; opacity: 1;">
|
||||
</line>
|
||||
{{else if (eq ../borderEdge "top")}}
|
||||
<line x1="47" y1="1" x2="47" y2="47" stroke="{{../borderColor}}" stroke-width="2"
|
||||
stroke-linecap="round" pathLength="100" stroke-dasharray="{{countdown.percentage}} 100"
|
||||
style="transition: stroke-dasharray 0.3s ease; opacity: 1;">
|
||||
</line>
|
||||
{{else if (eq ../borderEdge "left")}}
|
||||
<line x1="1" y1="1" x2="47" y2="1" stroke="{{../borderColor}}" stroke-width="2"
|
||||
stroke-linecap="round" pathLength="100" stroke-dasharray="{{countdown.percentage}} 100"
|
||||
style="transition: stroke-dasharray 0.3s ease; opacity: 1;">
|
||||
</line>
|
||||
{{else if (eq ../borderEdge "right")}}
|
||||
<line x1="1" y1="47" x2="47" y2="47" stroke="{{../borderColor}}" stroke-width="2"
|
||||
stroke-linecap="round" pathLength="100" stroke-dasharray="{{countdown.percentage}} 100"
|
||||
style="transition: stroke-dasharray 0.3s ease; opacity: 1;">
|
||||
</line>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{else}}
|
||||
{{#if ../invertBorder}}
|
||||
<rect x="1" y="1" width="46" height="46" rx="8" ry="8" fill="none"
|
||||
stroke="{{../borderColor}}" stroke-width="2" pathLength="100"
|
||||
|
|
@ -119,6 +170,7 @@
|
|||
style="transition: stroke-dasharray 0.3s ease; opacity: 1;"></rect>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</svg>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue