Example output of <Stat/> component

Stat_Widgets.html

<div class="row">
  <div class="col-md-3 col-sm-6">
    <div class="widget widget-stats bg-blue-grey">
      <div class="stats-icon stats-icon-lg"><i class="fa fa-fw fa-globe"></i></div>
      <div class="stats-title">Todays Visits</div>
      <div class="stats-number">123</div>
      <div class="stats-progress progress">
        <div class="progress-bar" style="width: 70.1%;"></div>
      </div>
      <div class="stats-desc">Better than last week (70.1%)</div>
      <div class="stats-desc">
        <!-- react-text: 513 -->checks: <!-- /react-text --><!-- react-text: 7725 -->5<!-- /react-text -->
      </div>
      <div class="stats-desc">
        <!-- react-text: 515 -->lastCheck: <!-- /react-text --><!-- react-text: 7726 -->1505846303<!-- /react-text -->
      </div>
      <div class="stats-link">
        <a href="javascript:;">
          <!-- react-text: 518 -->View Detail <!-- /react-text --><i class="fa fa-arrow-circle-o-right"></i>
        </a>
      </div>
    </div>
  </div>
  <div class="col-md-3 col-sm-6">
    <div class="widget widget-stats bg-blue">
      <div class="stats-icon stats-icon-lg"><i class="fa fa-fw fa-tags"></i></div>
      <div class="stats-title">Todays Profit</div>
      <div class="stats-number">123950</div>
      <div class="stats-progress progress">
        <div class="progress-bar" style="width: 70.1%;"></div>
      </div>
      <div class="stats-desc">Better than last week</div>
      <div class="stats-desc">
        <!-- react-text: 530 -->checks: <!-- /react-text --><!-- react-text: 7719 -->585<!-- /react-text -->
      </div>
      <div class="stats-desc">
        <!-- react-text: 532 -->lastCheck: <!-- /react-text --><!-- react-text: 7720 -->1505846306<!-- /react-text -->
      </div>
      <div class="stats-link">
        <a href="javascript:;">
          <!-- react-text: 535 -->View Detail <!-- /react-text --><i class="fa fa-arrow-circle-o-right"></i>
        </a>
      </div>
    </div>
  </div>
  <div class="col-md-3 col-sm-6">
    <div class="widget widget-stats bg-cyan">
      <div class="stats-icon stats-icon-lg"><i class="fa fa-fw fa-shopping-cart"></i></div>
      <div class="stats-title">New Orders</div>
      <div class="stats-number">503242</div>
      <div class="stats-progress progress">
        <div class="progress-bar" style="width: 70.1%;"></div>
      </div>
      <div class="stats-desc">Blah blah</div>
      <div class="stats-desc">
        <!-- react-text: 547 -->checks: <!-- /react-text --><!-- react-text: 7721 -->585<!-- /react-text -->
      </div>
      <div class="stats-desc">
        <!-- react-text: 549 -->lastCheck: <!-- /react-text --><!-- react-text: 7722 -->1505846306<!-- /react-text -->
      </div>
      <div class="stats-link">
        <a href="javascript:;">
          <!-- react-text: 552 -->View Detail <!-- /react-text --><i class="fa fa-arrow-circle-o-right"></i>
        </a>
      </div>
    </div>
  </div>
  <div class="col-md-3 col-sm-6">
    <div class="widget widget-stats bg-primary">
      <div class="stats-icon stats-icon-lg"><i class="fa fa-fw fa-undefined"></i></div>
      <div class="stats-title">New Comments</div>
      <div class="stats-number">3463</div>
      <div class="stats-progress progress">
        <div class="progress-bar" style="width: 70.1%;"></div>
      </div>
      <div class="stats-desc">Better than...</div>
      <div class="stats-desc">
        <!-- react-text: 564 -->checks: <!-- /react-text --><!-- react-text: 7723 -->585<!-- /react-text -->
      </div>
      <div class="stats-desc">
        <!-- react-text: 566 -->lastCheck: <!-- /react-text --><!-- react-text: 7724 -->1505846306<!-- /react-text -->
      </div>
      <div class="stats-link">
        <a href="javascript:;">
          <!-- react-text: 569 -->View Detail <!-- /react-text --><i class="fa fa-arrow-circle-o-right"></i>
        </a>
      </div>
    </div>
  </div>
</div>