optimize icons
This commit is contained in:
parent
6e7c989959
commit
2ad3b8a631
3 changed files with 14 additions and 75 deletions
|
@ -1,28 +1,6 @@
|
|||
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
:root
|
||||
{
|
||||
--radius: calc(2 * 3.1415926536 * 7.5px);
|
||||
--max-gap: calc(var(--radius) * .99);
|
||||
--min-gap: calc(var(--radius) * .5);
|
||||
}
|
||||
|
||||
@keyframes stroke-rotate
|
||||
{
|
||||
0% { stroke-dashoffset: var(--max-gap); }
|
||||
100% { stroke-dashoffset: var(--min-gap); }
|
||||
}
|
||||
|
||||
circle
|
||||
{
|
||||
fill: transparent;
|
||||
stroke: context-fill;
|
||||
stroke-width: 1px;
|
||||
stroke-dasharray: var(--radius);
|
||||
stroke-linecap: round;
|
||||
transform-origin: center;
|
||||
animation: stroke-rotate 1.333s cubic-bezier(.35, 0, .25, 1) both;
|
||||
}
|
||||
</style>
|
||||
<circle cx="50%" cy="50%" r="7.5px"/>
|
||||
</svg>
|
||||
<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
@keyframes stroke-rotate{0%{stroke-dashoffset:var(--max-gap)}to{stroke-dashoffset:var(--min-gap)}}:root{--radius:calc(2 * 3.1415926536 * 7.5px);--max-gap:calc(var(--radius) * .99);--min-gap:calc(var(--radius) * .5)}
|
||||
</style>
|
||||
<circle cx="50%" cy="50%" r="7.5" style="fill:transparent;stroke:context-fill;stroke-width:1px;stroke-dasharray:var(--radius);stroke-linecap:round;transform-origin:center;animation:stroke-rotate 1.333s cubic-bezier(.35,0,.25,1) both"/>
|
||||
</svg>
|
||||
|
|
Before Width: | Height: | Size: 671 B After Width: | Height: | Size: 550 B |
Loading…
Add table
Add a link
Reference in a new issue