<!DOCTYPE html> <head> {{template "header.html" "Dashboard"}} </head> <body class="header-fixed sidebar-fixed sidebar-dark header-light" id="body"> <div class="wrapper"> {{template "navbar.html" "dashboard"}} <div class="page-wrapper"> <!-- Header --> <header class="main-header " id="header"> <nav class="navbar navbar-static-top navbar-expand-lg"> <!-- Sidebar toggle button --> <button id="sidebar-toggler" class="sidebar-toggle"> <span class="sr-only">Toggle navigation</span> </button> </nav> </header> <div class="content-wrapper"> <div class="content"> <div class="row"> <div class="col-xl-12 col-md-12"> <!-- Sales Graph --> <div class="card card-default" data-scroll-height="675"> <div class="card-header"> <h2>Download/Upload speed</h2> </div> <div class="card-body"> <canvas id="chart-general-network" class="chartjs"></canvas> </div> <div class="card-footer d-flex flex-wrap bg-white p-0"> <div class="col-6 px-0"> <div class="text-center p-4"> <h4 id="general-download-speed">...</h4> <p class="mt-2">Download Speed</p> </div> </div> <div class="col-6 px-0"> <div class="text-center p-4 border-left"> <h4 id="general-upload-speed">...</h4> <p class="mt-2">Upload Speed</p> </div> </div> </div> </div> </div> </div> <div class="row"> <div class="col-xl-4 col-md-12"> <!-- Doughnut Chart --> <div class="card card-default" data-scroll-height="675"> <div class="card-header justify-content-center"> <h2>Main cache</h2> </div> <div class="card-body"> <canvas id="main-cache-chart"></canvas> </div> <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>Used</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>Free</li> </ul> </div> </div> </div> </div> </div> </div> </div> <footer class="footer mt-auto"> <div class="copyright bg-white"> </div> </footer> </div> </div> {{template "footer.html"}} <script src="assets/js/general_chart.js"></script> <script src="assets/js/cache_chart.js"></script> <script src="assets/js/dashboard.js"></script> <script> tstor.dashboard.loadView(); setInterval(function () { tstor.dashboard.loadView(); }, 2000) </script> </body> </html>