angular-flip-clock/src/js/angular-flip-clock-number-directive/angular-flip-clock-number-directive.html

Port of FlipClock.js to Angular without any dependencies

<ul class="dy-flip-clock-number" ng-class="{'dy-flip-clock-number-animated': vm.isAnimated()}">
  <li
    ng-repeat="number in ::vm.numbers"
    class="dy-flip-clock-number-digit"
    ng-class="{'dy-flip-clock-number-digit-active': vm.isActive(number), 'dy-flip-clock-number-digit-before': vm.isBefore(number)}"
  >
    <div class="dy-flip-clock-card">
      <div class="dy-flip-clock-card-up">
        <div class="dy-flip-clock-card-shadow"></div>
        <div class="dy-flip-clock-card-value dy-flip-clock-card-value-up">{{::number}}</div>
      </div>
      <div class="dy-flip-clock-card-down">
        <div class="dy-flip-clock-card-shadow"></div>
        <div class="dy-flip-clock-card-value dy-flip-clock-card-value-down">{{::number}}</div>
      </div>
    </div>
  </li>
</ul>