| @@ -1,33 +1 @@ | ||
| 1 | -.ablocks-block--svg-draw .ablocks-block-container { | |
| 2 | - display: flex; | |
| 3 | -} | |
| 4 | - | |
| 5 | -.ablocks-block--svg-draw .ablocks-block-container .ablocks-icon-wrap > svg > path { | |
| 6 | - fill: transparent; | |
| 7 | - stroke-width: 10px; | |
| 8 | - stroke-dasharray: 1560; | |
| 9 | - stroke-dashoffset: 0; | |
| 10 | - animation: ablocks-svg-animate ease-in-out infinite; | |
| 11 | - animation-direction: reverse; | |
| 12 | -} | |
| 13 | - | |
| 14 | -@keyframes ablocks-svg-animate { | |
| 15 | - 0% { | |
| 16 | - stroke-dashoffset: 0; | |
| 17 | - } | |
| 18 | - 40% { | |
| 19 | - stroke-dashoffset: 1560; | |
| 20 | - } | |
| 21 | - 80% { | |
| 22 | - stroke-dashoffset: 3120; | |
| 23 | - fill: transparent; | |
| 24 | - } | |
| 25 | - 90% { | |
| 26 | - stroke-dashoffset: 3120; | |
| 27 | - fill: unset; | |
| 28 | - } | |
| 29 | - 100% { | |
| 30 | - stroke-dashoffset: 3120; /* Keep it the same but add a delay for 5s here */ | |
| 31 | - fill: unset; | |
| 32 | - } | |
| 33 | -} | |
| 1 | +.ablocks-block--svg-draw .ablocks-block-container{display:flex}.ablocks-block--svg-draw .ablocks-icon-wrap>svg>path{animation:ablocks-svg-animate ease-in-out infinite;animation-direction:reverse;fill:transparent;stroke-dasharray:1560;stroke-dashoffset:0;stroke-width:10px}@keyframes ablocks-svg-animate{0%{stroke-dashoffset:0}40%{stroke-dashoffset:1560}80%{fill:transparent;stroke-dashoffset:3120}90%{fill:unset;stroke-dashoffset:3120}to{fill:unset;stroke-dashoffset:3120}} | |
