53 lines
2.8 KiB
JSON
53 lines
2.8 KiB
JSON
<!-- begin widget-chart -->
|
|
<div class="widget rounded">
|
|
<div class="widget-header">
|
|
<h4 class="widget-header-title">Audience Overview</h4>
|
|
<div class="widget-header-icon"><a href="#" class="text-body text-opacity-50"><i class="fa fa-fw fa-upload"></i></a></div>
|
|
<div class="widget-header-icon"><a href="#" class="text-body text-opacity-50"><i class="fa fa-fw fa-cog"></i></a></div>
|
|
</div>
|
|
<div class="d-flex">
|
|
<div class="flex-1 widget-chart-content">
|
|
<div id="nv-stacked-area-chart" style="height: 108%"></div>
|
|
</div>
|
|
<div class="p-3" style="width: 30%;">
|
|
<div class="widget-chart-info">
|
|
<h4 class="widget-chart-info-title">Total sales</h4>
|
|
<p class="widget-chart-info-desc">Lorem ipsum dolor sit consectetur adipiscing elit.</p>
|
|
<div class="widget-chart-info-progress">
|
|
<b>Monthly Plan</b>
|
|
<span class="float-end">70%</span>
|
|
</div>
|
|
<div class="progress h-10px">
|
|
<div class="progress-bar progress-bar-striped progress-bar-animated rounded-pill" style="width:70%;"></div>
|
|
</div>
|
|
</div>
|
|
<hr />
|
|
<div class="widget-chart-info">
|
|
<h4 class="widget-chart-info-title">Task progress</h4>
|
|
<p class="widget-chart-info-desc">Vestibulum sollicitudin in lectus a cursus.</p>
|
|
<div class="widget-chart-info-progress">
|
|
<b>Marketing Research</b>
|
|
<span class="float-end">74%</span>
|
|
</div>
|
|
<div class="progress h-10px mb-15px">
|
|
<div class="progress-bar progress-bar-striped progress-bar-animated rounded-pill bg-indigo" style="width: 74%"></div>
|
|
</div>
|
|
<div class="widget-chart-info-progress">
|
|
<b>Mobile App Development</b>
|
|
<span class="float-end">25%</span>
|
|
</div>
|
|
<div class="progress h-10px mb-15px">
|
|
<div class="progress-bar progress-bar-striped progress-bar-animated rounded-pill bg-green" style="width: 25%"></div>
|
|
</div>
|
|
<div class="widget-chart-info-progress">
|
|
<b>Website Redesign</b>
|
|
<span class="float-end">95%</span>
|
|
</div>
|
|
<div class="progress h-10px">
|
|
<div class="progress-bar progress-bar-striped progress-bar-animated rounded-pill bg-orange" style="width: 95%"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- end widget-chart --> |