Panel

Default

Panel Default

<div class="panel panel-default "> <div class="panel-heading"> <svg class="icon " viewBox="0 0 32 32"> <use xlink:href="/assets/toolkit/svg/sprite.symbol.svg#check"></use> </svg> <h4>Panel Default</h4> </div> <div class="panel-body h-100 d-flex flex-column pvs"> </div> <div class="panel-footer"> </div> </div>

Chart

Panel Chart

<div class="panel panel-chart "> <div class="panel-heading"> <h4>Panel Chart</h4> </div> <div class="panel-body"> <div class="chart"> <div class="chart--matrix"> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> <div class="chart--matrix-dot skipped"></div> </div> </div> </div> <div class="panel-footer"> <svg class="icon icon-success" viewBox="0 0 32 32"> <use xlink:href="/assets/toolkit/svg/sprite.symbol.svg#check"></use> </svg> <p>Stand: 14:12:08</p> <span style="margin-left:auto" data-time="5">5s</span> </div> </div>