Basic markup for current countdown:
<div class="wrap-radial-countdown" data-countdown="" data-from="2017-08-19T20:00:00" data-to="2017-09-20T20:30:00"> <div class="progress-circle" data-circle-countdown="data-circle-countdown" data-units="Days"> <svg x="0px" y="0px" width="200px" height="200px" viewbox="0 0 100 100"> <clippath class="progress-clip"> <path d=""></path> </clippath> <circle class="circle-bg" cx="50" cy="50" r="50"></circle> <circle class="progress clipped" cx="50" cy="50" r="50"></circle> </svg> <div class="countdown-counter"></div> </div> </div>
Basic markup for current countdown:
<div class="wrap-radial-countdown" data-countdown="" data-from="2017-08-19T20:00:00" data-to="2018-04-20T20:30:00"> <svg class="countdown-gradient" x="0px" y="0px" width="0" height="0" viewbox="0 0 0 0"> <defs> <lineargradient id="Gradient1"> <stop class="stop-color-1" offset="0%"></stop> <stop class="stop-color-2" offset="80%"> </stop> </lineargradient> </defs> </svg> <div class="progress-circle" data-circle-countdown="data-circle-countdown" data-units="Days"> <svg x="0px" y="0px" width="200px" height="200px" viewbox="0 0 100 100"> <clippath class="progress-clip"> <path d=""></path> </clippath> <circle class="circle-bg" cx="50" cy="50" r="45"> </circle> <circle class="progress-gradient clipped" cx="50" cy="50" r="50"></circle> </svg> <div class="countdown-counter"></div> </div> </div>
Basic markup for current countdown:
<div class="wrap-radial-countdown" data-countdown="" data-from="2017-08-19T20:00:00" data-to="2018-04-20T20:30:00"> <svg class="countdown-gradient" x="0px" y="0px" width="0" height="0" viewbox="0 0 0 0"> <defs> <lineargradient id="Gradient2"> <stop class="stop-color-1" offset="0%"></stop> <stop class="stop-color-2" offset="80%"></stop> </lineargradient> </defs> </svg> <div class="progress-circle progress-circle-radial" data-circle-countdown="data-circle-countdown" data-units="Days"> <svg x="0px" y="0px" width="200px" height="200px" viewbox="0 0 100 100"> <clippath class="progress-clip"> <path d=""></path> </clippath> <circle class="circle-stroke" cx="50" cy="50" r="45"></circle> <circle class="circle-bg" cx="50" cy="50" r="38"></circle> <circle class="progress-gradient-radial clipped" cx="50" cy="50" r="45"></circle> </svg> <div class="progress-counter-wrap"> <div class="countdown-counter"></div> <div class="countdown-title">Days</div> </div> </div> </div>
Basic markup for current countdown:
<div class="wrap-radial-countdown" data-countdown="" data-from="2017-08-19T20:00:00" data-to="2018-04-20T20:30:00"> <div class="progress-circle progress-circle-radial" data-circle-countdown="data-circle-countdown" data-units="Days"> <svg x="0px" y="0px" width="200px" height="200px" viewbox="0 0 100 100"> <clippath class="progress-clip"> <path d=""></path> </clippath> <circle class="circle-stroke" cx="50" cy="50" r="45"></circle> <circle class="progress clipped" cx="50" cy="50" r="45"></circle> </svg> <div class="progress-counter-wrap"> <div class="countdown-counter"></div> <div class="countdown-title">Days</div> </div> </div> </div>