sleek-dashboard
Version:
Premium & Free Bootstrap 4 admin dashboard template by TAFcoder.com
30 lines (28 loc) • 1.75 kB
HTML
<!-- Doughnut Chart -->
<div class="card card-default" data-scroll-height="675">
<div class="card-header justify-content-center">
<h2>Orders Overview</h2>
</div>
<div class="card-body" >
<canvas id="doChart" ></canvas>
</div>
<a href="#" class="pb-5 d-block text-center text-muted"><i class="mdi mdi-download mr-2"></i> Download overall report</a>
<div class="card-footer d-flex flex-wrap bg-white p-0">
<div class="col-6">
<div class="py-4 px-4">
<ul class="d-flex flex-column justify-content-between">
<li class="mb-2"><i class="mdi mdi-checkbox-blank-circle-outline mr-2" style="color: #4c84ff"></i>Order Completed</li>
<li><i class="mdi mdi-checkbox-blank-circle-outline mr-2" style="color: #80e1c1 "></i>Order Unpaid</li>
</ul>
</div>
</div>
<div class="col-6 border-left">
<div class="py-4 px-4 ">
<ul class="d-flex flex-column justify-content-between">
<li class="mb-2"><i class="mdi mdi-checkbox-blank-circle-outline mr-2" style="color: #8061ef"></i>Order Pending</li>
<li><i class="mdi mdi-checkbox-blank-circle-outline mr-2" style="color: #ffa128"></i>Order Canceled</li>
</ul>
</div>
</div>
</div>
</div>