|
|
@@ -384,7 +384,7 @@
|
|
|
<div class="col-md-4 col-sm-6 col-xs-12">
|
|
|
<div class="x_panel fixed_height_320">
|
|
|
<div class="x_title">
|
|
|
- <h2>Application Devices <small>Sessions</small></h2>
|
|
|
+ <h2>App Devices <small>Sessions</small></h2>
|
|
|
<ul class="nav navbar-right panel_toolbox">
|
|
|
<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
|
|
|
</li>
|
|
|
@@ -493,7 +493,7 @@
|
|
|
<div class="col-md-4 col-sm-6 col-xs-12">
|
|
|
<div class="x_panel fixed_height_320">
|
|
|
<div class="x_title">
|
|
|
- <h2>Daily active users <small>Sessions</small></h2>
|
|
|
+ <h2>Daily users <small>Sessions</small></h2>
|
|
|
<ul class="nav navbar-right panel_toolbox">
|
|
|
<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
|
|
|
</li>
|
|
|
@@ -512,70 +512,68 @@
|
|
|
<div class="clearfix"></div>
|
|
|
</div>
|
|
|
<div class="x_content">
|
|
|
-
|
|
|
- <table class="tile" style="width:100%">
|
|
|
- <tr>
|
|
|
- <th style="width:37%;">
|
|
|
- <span>Top 5</span>
|
|
|
- </th>
|
|
|
- <th>
|
|
|
- <div class="col-lg-7 col-md-7 col-sm-7 col-xs-7">
|
|
|
- <span class="hidden-small">Disbursement</span>
|
|
|
- </div>
|
|
|
- <div class="col-lg-5 col-md-5 col-sm-5 col-xs-5">
|
|
|
- <span class="hidden-small">Progress</span>
|
|
|
- </div>
|
|
|
- </th>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td>
|
|
|
- <canvas id="canvas1" height="140" width="140" style="margin: 15px 10px 10px 0"></canvas>
|
|
|
- </td>
|
|
|
- <td>
|
|
|
- <table class="tile_info">
|
|
|
- <tr>
|
|
|
- <td>
|
|
|
- <p><i class="fa fa-square blue"></i>IOS </p>
|
|
|
- </td>
|
|
|
- <td>30%</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td>
|
|
|
- <p><i class="fa fa-square green"></i>Android </p>
|
|
|
- </td>
|
|
|
- <td>10%</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td>
|
|
|
- <p><i class="fa fa-square purple"></i>Blackberry </p>
|
|
|
- </td>
|
|
|
- <td>20%</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td>
|
|
|
- <p><i class="fa fa-square aero"></i>Symbian </p>
|
|
|
- </td>
|
|
|
- <td>15%</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td>
|
|
|
- <p><i class="fa fa-square red"></i>Others </p>
|
|
|
- </td>
|
|
|
- <td>30%</td>
|
|
|
- </tr>
|
|
|
- </table>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
- </table>
|
|
|
+ <table class="" style="width:100%">
|
|
|
+ <tr>
|
|
|
+ <th style="width:37%;">
|
|
|
+ <p>Top 5</p>
|
|
|
+ </th>
|
|
|
+ <th>
|
|
|
+ <div class="col-lg-7 col-md-7 col-sm-7 col-xs-7">
|
|
|
+ <p class="">Device</p>
|
|
|
+ </div>
|
|
|
+ <div class="col-lg-5 col-md-5 col-sm-5 col-xs-5">
|
|
|
+ <p class="">Progress</p>
|
|
|
+ </div>
|
|
|
+ </th>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>
|
|
|
+ <canvas id="canvas1" height="140" width="140" style="margin: 15px 10px 10px 0"></canvas>
|
|
|
+ </td>
|
|
|
+ <td>
|
|
|
+ <table class="tile_info">
|
|
|
+ <tr>
|
|
|
+ <td>
|
|
|
+ <p><i class="fa fa-square blue"></i>IOS </p>
|
|
|
+ </td>
|
|
|
+ <td>30%</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>
|
|
|
+ <p><i class="fa fa-square green"></i>Android </p>
|
|
|
+ </td>
|
|
|
+ <td>10%</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>
|
|
|
+ <p><i class="fa fa-square purple"></i>Blackberry </p>
|
|
|
+ </td>
|
|
|
+ <td>20%</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>
|
|
|
+ <p><i class="fa fa-square aero"></i>Symbian </p>
|
|
|
+ </td>
|
|
|
+ <td>15%</td>
|
|
|
+ </tr>
|
|
|
+ <tr>
|
|
|
+ <td>
|
|
|
+ <p><i class="fa fa-square red"></i>Others </p>
|
|
|
+ </td>
|
|
|
+ <td>30%</td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
-
|
|
|
<div class="col-md-4 col-sm-6 col-xs-12">
|
|
|
<div class="x_panel fixed_height_320">
|
|
|
<div class="x_title">
|
|
|
- <h2>Daily active users <small>Sessions</small></h2>
|
|
|
+ <h2>Profile Settings <small>Sessions</small></h2>
|
|
|
<ul class="nav navbar-right panel_toolbox">
|
|
|
<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
|
|
|
</li>
|
|
|
@@ -596,27 +594,20 @@
|
|
|
<div class="x_content">
|
|
|
<div class="dashboard-widget-content">
|
|
|
<ul class="quick-list">
|
|
|
- <li><i class="fa fa-calendar-o"></i><a href="#">Settings</a>
|
|
|
- </li>
|
|
|
- <li><i class="fa fa-bars"></i><a href="#">Subscription</a>
|
|
|
- </li>
|
|
|
- <li><i class="fa fa-bar-chart"></i><a href="#">Auto Renewal</a> </li>
|
|
|
- <li><i class="fa fa-line-chart"></i><a href="#">Achievements</a>
|
|
|
- </li>
|
|
|
- <li><i class="fa fa-bar-chart"></i><a href="#">Auto Renewal</a> </li>
|
|
|
- <li><i class="fa fa-line-chart"></i><a href="#">Achievements</a>
|
|
|
- </li>
|
|
|
- <li><i class="fa fa-area-chart"></i><a href="#">Logout</a>
|
|
|
- </li>
|
|
|
+ <li><i class="fa fa-line-chart"></i><a href="#">Achievements</a></li>
|
|
|
+ <li><i class="fa fa-thumbs-up"></i><a href="#">Favorites</a></li>
|
|
|
+ <li><i class="fa fa-calendar-o"></i><a href="#">Activities</a></li>
|
|
|
+ <li><i class="fa fa-cog"></i><a href="#">Settings</a></li>
|
|
|
+ <li><i class="fa fa-area-chart"></i><a href="#">Logout</a></li>
|
|
|
</ul>
|
|
|
|
|
|
<div class="sidebar-widget">
|
|
|
<h4>Profile Completion</h4>
|
|
|
<canvas width="150" height="80" id="foo" class="" style="width: 160px; height: 100px;"></canvas>
|
|
|
<div class="goal-wrapper">
|
|
|
- <span class="gauge-value pull-left">$</span>
|
|
|
- <span id="gauge-text" class="gauge-value pull-left">3,200</span>
|
|
|
- <span id="goal-text" class="goal-value pull-right">$5,000</span>
|
|
|
+ <span id="gauge-text" class="gauge-value pull-left">0</span>
|
|
|
+ <span class="gauge-value pull-left">%</span>
|
|
|
+ <span id="goal-text" class="goal-value pull-right">100%</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -718,7 +709,7 @@
|
|
|
<div class="col-md-4 col-sm-6 col-xs-12">
|
|
|
<div class="x_panel">
|
|
|
<div class="x_title">
|
|
|
- <h2>Daily active users <small>Sessions</small></h2>
|
|
|
+ <h2>Today's Weather <small>Sessions</small></h2>
|
|
|
<ul class="nav navbar-right panel_toolbox">
|
|
|
<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
|
|
|
</li>
|
|
|
@@ -844,11 +835,10 @@
|
|
|
</div>
|
|
|
<!-- end of weather widget -->
|
|
|
|
|
|
-
|
|
|
<div class="col-md-4 col-sm-6 col-xs-12">
|
|
|
<div class="x_panel fixed_height_320">
|
|
|
<div class="x_title">
|
|
|
- <h2>Daily active users <small>Sessions</small></h2>
|
|
|
+ <h2>Incomes <small>Sessions</small></h2>
|
|
|
<ul class="nav navbar-right panel_toolbox">
|
|
|
<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
|
|
|
</li>
|
|
|
@@ -869,27 +859,18 @@
|
|
|
<div class="x_content">
|
|
|
<div class="dashboard-widget-content">
|
|
|
<ul class="quick-list">
|
|
|
- <li><i class="fa fa-calendar-o"></i><a href="#">Settings</a>
|
|
|
- </li>
|
|
|
- <li><i class="fa fa-bars"></i><a href="#">Subscription</a>
|
|
|
- </li>
|
|
|
+ <li><i class="fa fa-bars"></i><a href="#">Subscription</a></li>
|
|
|
<li><i class="fa fa-bar-chart"></i><a href="#">Auto Renewal</a> </li>
|
|
|
- <li><i class="fa fa-line-chart"></i><a href="#">Achievements</a>
|
|
|
- </li>
|
|
|
- <li><i class="fa fa-bar-chart"></i><a href="#">Auto Renewal</a> </li>
|
|
|
- <li><i class="fa fa-line-chart"></i><a href="#">Achievements</a>
|
|
|
- </li>
|
|
|
- <li><i class="fa fa-area-chart"></i><a href="#">Logout</a>
|
|
|
- </li>
|
|
|
+ <li><i class="fa fa-support"></i><a href="#">Help Desk</a> </li>
|
|
|
+ <li><i class="fa fa-heart"></i><a href="#">Donations</a> </li>
|
|
|
</ul>
|
|
|
|
|
|
<div class="sidebar-widget">
|
|
|
- <h4>Profile Completion</h4>
|
|
|
+ <h4>Goal</h4>
|
|
|
<canvas width="150" height="80" id="foo2" class="" style="width: 160px; height: 100px;"></canvas>
|
|
|
<div class="goal-wrapper">
|
|
|
- <span class="gauge-value pull-left">$</span>
|
|
|
<span id="gauge-text2" class="gauge-value pull-left">3,200</span>
|
|
|
- <span id="goal-text2" class="goal-value pull-right">$5,000</span>
|
|
|
+ <span id="goal-text2" class="goal-value pull-right">5,000</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -930,7 +911,6 @@
|
|
|
<script src="js/icheck/icheck.min.js"></script>
|
|
|
<!-- gauge js -->
|
|
|
<script type="text/javascript" src="js/gauge/gauge.min.js"></script>
|
|
|
- <script type="text/javascript" src="js/gauge/gauge_demo.js"></script>
|
|
|
<!-- daterangepicker -->
|
|
|
<script type="text/javascript" src="js/moment/moment.min.js"></script>
|
|
|
<script type="text/javascript" src="js/datepicker/daterangepicker.js"></script>
|
|
|
@@ -1015,7 +995,7 @@
|
|
|
}], options);
|
|
|
</script>
|
|
|
<!-- /flot -->
|
|
|
- <!-- -->
|
|
|
+
|
|
|
<script>
|
|
|
$('document').ready(function() {
|
|
|
$(".sparkline_one").sparkline([2, 4, 3, 4, 5, 4, 5, 4, 3, 4, 5, 6, 7, 5, 4, 3, 5, 6], {
|
|
|
@@ -1039,47 +1019,52 @@
|
|
|
spotColor: '#26B99A',
|
|
|
minSpotColor: '#26B99A'
|
|
|
});
|
|
|
+ });
|
|
|
+ </script>
|
|
|
|
|
|
- Chart.defaults.global.legend = {
|
|
|
- enabled: false
|
|
|
- };
|
|
|
-
|
|
|
- var data = {
|
|
|
- labels: [
|
|
|
- "Symbian",
|
|
|
- "Blackberry",
|
|
|
- "Other",
|
|
|
- "Android",
|
|
|
- "IOS"
|
|
|
- ],
|
|
|
- datasets: [{
|
|
|
- data: [15, 20, 30, 10, 30],
|
|
|
- backgroundColor: [
|
|
|
- "#BDC3C7",
|
|
|
- "#9B59B6",
|
|
|
- "#455C73",
|
|
|
- "#26B99A",
|
|
|
- "#3498DB"
|
|
|
- ],
|
|
|
- hoverBackgroundColor: [
|
|
|
- "#CFD4D8",
|
|
|
- "#B370CF",
|
|
|
- "#34495E",
|
|
|
- "#36CAAB",
|
|
|
- "#49A9EA"
|
|
|
- ]
|
|
|
-
|
|
|
- }]
|
|
|
+ <!-- Doughnut Chart -->
|
|
|
+ <script>
|
|
|
+ $('document').ready(function() {
|
|
|
+ var options = {
|
|
|
+ legend: false,
|
|
|
+ responsive: false
|
|
|
};
|
|
|
|
|
|
- var canvasDoughnut = new Chart(document.getElementById("canvas1"), {
|
|
|
+ new Chart(document.getElementById("canvas1"), {
|
|
|
type: 'doughnut',
|
|
|
tooltipFillColor: "rgba(51, 51, 51, 0.55)",
|
|
|
- data: data
|
|
|
+ data: {
|
|
|
+ labels: [
|
|
|
+ "Symbian",
|
|
|
+ "Blackberry",
|
|
|
+ "Other",
|
|
|
+ "Android",
|
|
|
+ "IOS"
|
|
|
+ ],
|
|
|
+ datasets: [{
|
|
|
+ data: [15, 20, 30, 10, 30],
|
|
|
+ backgroundColor: [
|
|
|
+ "#BDC3C7",
|
|
|
+ "#9B59B6",
|
|
|
+ "#E74C3C",
|
|
|
+ "#26B99A",
|
|
|
+ "#3498DB"
|
|
|
+ ],
|
|
|
+ hoverBackgroundColor: [
|
|
|
+ "#CFD4D8",
|
|
|
+ "#B370CF",
|
|
|
+ "#E95E4F",
|
|
|
+ "#36CAAB",
|
|
|
+ "#49A9EA"
|
|
|
+ ]
|
|
|
+ }]
|
|
|
+ },
|
|
|
+ options: options
|
|
|
});
|
|
|
});
|
|
|
</script>
|
|
|
- <!-- -->
|
|
|
+ <!-- /Doughnut Chart -->
|
|
|
+
|
|
|
<!-- datepicker -->
|
|
|
<script type="text/javascript">
|
|
|
$(document).ready(function() {
|
|
|
@@ -1224,11 +1209,18 @@
|
|
|
strokeColor: '#F0F3F3', // to see which ones work best for you
|
|
|
generateGradient: true
|
|
|
};
|
|
|
- var target = document.getElementById('foo2'); // your canvas element
|
|
|
- var gauge = new Gauge(target).setOptions(opts); // create sexy gauge!
|
|
|
+ var target = document.getElementById('foo'), // your canvas element
|
|
|
+ gauge = new Gauge(target).setOptions(opts); // create sexy gauge!
|
|
|
+ gauge.maxValue = 100; // set max gauge value
|
|
|
+ gauge.animationSpeed = 32; // set animation speed (32 is default value)
|
|
|
+ gauge.set(80); // set actual value
|
|
|
+ gauge.setTextField(document.getElementById("gauge-text"));
|
|
|
+
|
|
|
+ var target = document.getElementById('foo2'), // your canvas element
|
|
|
+ gauge = new Gauge(target).setOptions(opts); // create sexy gauge!
|
|
|
gauge.maxValue = 5000; // set max gauge value
|
|
|
gauge.animationSpeed = 32; // set animation speed (32 is default value)
|
|
|
- gauge.set(3200); // set actual value
|
|
|
+ gauge.set(4200); // set actual value
|
|
|
gauge.setTextField(document.getElementById("gauge-text2"));
|
|
|
</script>
|
|
|
</body>
|
Aigars Silkalns