85 lines
3.1 KiB
HTML
85 lines
3.1 KiB
HTML
<html>
|
|
<head>
|
|
<title>Basking</title>
|
|
<link rel="stylesheet" type="text/css" href="./assets/vital.min.css" />
|
|
<link rel="stylesheet" type="text/css" href="./assets/styles.css" />
|
|
<link rel="apple-touch-icon" sizes="180x180" href="./assets/favicon/apple-touch-icon.png">
|
|
<link rel="icon" type="image/png" sizes="32x32" href="./assets/favicon/favicon-32x32.png">
|
|
<link rel="icon" type="image/png" sizes="16x16" href="./assets/favicon/favicon-16x16.png">
|
|
<link rel="manifest" href="./assets/favicon/site.webmanifest">
|
|
<link rel="shortcut icon" href="./assets/favicon/favicon.ico">
|
|
<meta name="msapplication-TileColor" content="#da532c">
|
|
<meta name="msapplication-config" content="./assets/favicon/browserconfig.xml">
|
|
<meta name="theme-color" content="#ffffff">
|
|
<meta content='IE=edge' http-equiv='X-UA-Compatible' />
|
|
<meta charset='UTF-8' />
|
|
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no' name='viewport' />
|
|
</head>
|
|
<body>
|
|
<script src="./assets/axios.min.js"></script>
|
|
<script src="./assets/vue.min.js"></script>
|
|
|
|
<div id="app">
|
|
<header class="nav">
|
|
<img src="./assets/logo.svg" alt="" class="logo" />
|
|
<h1 class="name">Basking</h1>
|
|
</header>
|
|
<main>
|
|
<div class="autogrid">
|
|
<section class="col">
|
|
<div class="feed-card">
|
|
<div class="autogrid">
|
|
<div class="col-1-3">
|
|
<div class="load" v-if="fetchingDiskSpace"></div>
|
|
<h4 v-else>Disk Used: {{diskCapacity}}</h4>
|
|
</div>
|
|
<div class="col-2-3">
|
|
<meter min="0" v-bind:max="diskSize" v-bind:value="diskUsed"></meter>
|
|
</div>
|
|
</div>
|
|
<div class="autogrid">
|
|
<div class="col-1-3">
|
|
<div class="load" v-if="fetchingCPUUsage"></div>
|
|
<h4 v-else>CPU Used: {{cpuUsageStr}}</h4>
|
|
</div>
|
|
<div class="col-2-3">
|
|
<meter min="0" max="100" v-bind:value="cpuUsageNum"></meter>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="col">
|
|
<div class="feed-card">
|
|
<h2>Apps</h2>
|
|
<ul>
|
|
<li><a href="https://emby.basking.xyz/">Emby</a></li>
|
|
<li><a href="https://portainer.basking.xyz/">Portainer</a></li>
|
|
<li><a href="http://basking:32775/">Syncthing</a>*</li>
|
|
</ul>
|
|
<small>* Local Only</small>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</main>
|
|
|
|
<footer class="row">
|
|
<section class="section">
|
|
<small class="small">
|
|
Dashboard Built:
|
|
<span v-if="fetchingLastBuildDate" class="load smallest"></span>
|
|
<em v-else class="fadein">{{lastBuildDate}}</em>
|
|
</small>
|
|
/
|
|
<small class="small">
|
|
Uptime:
|
|
<span v-if="fetchingUptime" class="load smallest"></span>
|
|
<em v-else class="fadein">{{uptime}}</em>
|
|
</small>
|
|
</section>
|
|
</footer>
|
|
</div>
|
|
|
|
<script src="./assets/app.js"></script>
|
|
</body>
|
|
</html>
|