Webui
This commit is contained in:
RedMatriz
carbotaniuman
parent
964c4afb4b
commit
1c3fa630da
|
|
@ -6,8 +6,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|||
|
||||
## [Unreleased]
|
||||
### Added
|
||||
- [2020-06-16] Added WebUI versions to constants by [@RedMatriz].
|
||||
- [2020-06-16] Added WebUI PWA support for mobile by [@RedMatriz].
|
||||
- [2020-06-16] Added WebUI local data caching [@RedMatriz].
|
||||
|
||||
|
||||
### Changed
|
||||
- [2020-06-16] Changed log level of response timings to INFO by [@lflare].
|
||||
- [2020-06-16] api/pastStats no longer called on load of WebUI (this shouldn't affect hits/misses), will be reimplemented later [@RedMatriz].
|
||||
|
||||
### Deprecated
|
||||
|
||||
|
|
|
|||
|
|
@ -5,5 +5,6 @@ import java.time.Duration
|
|||
object Constants {
|
||||
const val CLIENT_BUILD = 8
|
||||
const val CLIENT_VERSION = "1.0"
|
||||
const val WEBUI_VERSION = "0.0.4"
|
||||
val MAX_AGE_CACHE: Duration = Duration.ofDays(14)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1 @@
|
|||
::-webkit-scrollbar{width:0}
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,371 +0,0 @@
|
|||
let theme;
|
||||
let style;
|
||||
let refreshRate;
|
||||
let graphTimeFrame;
|
||||
let doAnimations;
|
||||
//non-option var
|
||||
let statRequest;
|
||||
//stat vars
|
||||
let hitmiss,
|
||||
byte,
|
||||
cached,
|
||||
req;
|
||||
|
||||
jQuery(document).ready(function () {
|
||||
loadOptions();
|
||||
$("#theme").attr("href", "themes/" + theme + ".css");
|
||||
$("#style").attr("href", "themes/" + style + ".css");
|
||||
if (doAnimations) {
|
||||
$(".optionInput").addClass("smooth");
|
||||
$(".slider").addClass("smoothslider").addClass("smooth");
|
||||
$(".content").addClass("slide_up");
|
||||
$(".sideOption").addClass("smooth");
|
||||
$(".button").addClass("smooth");
|
||||
}
|
||||
loadStuff();
|
||||
fetch("/api/allStats")
|
||||
.then(response => async function () {
|
||||
let respj = JSON.parse(await response.text());
|
||||
updateValues(respj);
|
||||
console.log(respj);
|
||||
});
|
||||
statRequest = setInterval(getStats, refreshRate);
|
||||
});
|
||||
|
||||
function loadStuff() {
|
||||
hitmiss = new Chart(document.getElementById('hitpie').getContext('2d'), {
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
datasets: [{
|
||||
data: [0, 0, 0],
|
||||
backgroundColor: ["#72a555", "#ca566f", "#ab62c0"]
|
||||
}],
|
||||
labels: [
|
||||
'Hits',
|
||||
'Misses',
|
||||
'Browser Cached'
|
||||
]
|
||||
},
|
||||
options: {}
|
||||
});
|
||||
req = new Chart(document.getElementById('requestsserved').getContext('2d'), {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: [],
|
||||
datasets: [{
|
||||
label: 'Requests Served',
|
||||
backgroundColor: "#f00",
|
||||
borderColor: "#f00",
|
||||
data: [],
|
||||
fill: false
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
maintainAspectRatio: false,
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
byte = new Chart(document.getElementById('bytessent').getContext('2d'), {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: [],
|
||||
datasets: [{
|
||||
label: 'Bytes Sent',
|
||||
backgroundColor: "#f00",
|
||||
borderColor: "#f00",
|
||||
data: [],
|
||||
fill: false
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
maintainAspectRatio: false,
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
cached = new Chart(document.getElementById('browsercached').getContext('2d'), {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: [],
|
||||
datasets: [{
|
||||
label: 'Bytes On Disk',
|
||||
backgroundColor: "#f00",
|
||||
borderColor: "#f00",
|
||||
data: [],
|
||||
fill: false
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
maintainAspectRatio: false,
|
||||
scales: {
|
||||
yAxes: [{
|
||||
ticks: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}]
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//site functions, no connections involved
|
||||
|
||||
$(window).on("click", function () {
|
||||
let sideBar = $("#sideBar");
|
||||
if (sideBar.hasClass("expanded")) {
|
||||
sideBar.removeClass("expanded").addClass("retract").on(
|
||||
"animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
|
||||
function () {
|
||||
$(this).removeClass("retract").removeClass("expanded");
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
function loadOptions() {
|
||||
let options = JSON.parse(localStorage.getItem("options"));
|
||||
if (options === null) {
|
||||
options = {
|
||||
refresh_rate: 5000,
|
||||
theme: "lightTheme",
|
||||
style: "sharpStyle",
|
||||
graph_time_frame: 30000,
|
||||
do_animations: true,
|
||||
}
|
||||
}
|
||||
theme = options.theme;
|
||||
style = options.style;
|
||||
refreshRate = options.refresh_rate;
|
||||
graphTimeFrame = options.graph_time_frame;
|
||||
doAnimations = options.do_animations;
|
||||
$("#dataRefreshRate").val(refreshRate);
|
||||
$("#graphTimeFrame").val(graphTimeFrame);
|
||||
$("#themeIn").val(theme);
|
||||
$("#styleIn").val(style);
|
||||
$("#doAnimations").prop("checked", doAnimations);
|
||||
}
|
||||
|
||||
function resetOptions() {
|
||||
if (confirm("Do you really want to reset all customizations to defaults?")) {
|
||||
$("#dataRefreshRate").val(5000);
|
||||
$("#graphTimeFrame").val(30000);
|
||||
$("#themeIn").val("lightTheme");
|
||||
$("#styleIn").val("sharpStyle");
|
||||
$("#doAnimations").prop("checked", true);
|
||||
selectTab('dash', 'dashb');
|
||||
applyOptions()
|
||||
}
|
||||
}
|
||||
|
||||
function applyOptions() {
|
||||
let options = {
|
||||
refresh_rate: parseInt($("#dataRefreshRate").val()),
|
||||
theme: $("#themeIn").val(),
|
||||
style: $("#styleIn").val(),
|
||||
client_port: parseInt($("#port").val()),
|
||||
client_ip: $("#ip").val(),
|
||||
max_console_lines: parseInt($("#maxConsoleLines").val()),
|
||||
show_console_latest: $("#newestconsole").prop("checked"),
|
||||
graph_time_frame: parseInt($("#graphTimeFrame").val()),
|
||||
do_animations: $("#doAnimations").prop("checked"),
|
||||
lock_dashboard: $("#lockDash").prop("checked")
|
||||
};
|
||||
if (options.do_animations !== doAnimations) {
|
||||
doAnimations = options.do_animations;
|
||||
if (doAnimations) {
|
||||
$(".optionInput").addClass("smooth");
|
||||
$(".slider").addClass("smoothslider").addClass("smooth");
|
||||
$(".content").addClass("slide_up");
|
||||
$(".sideOption").addClass("smooth");
|
||||
$(".button").addClass("smooth");
|
||||
} else {
|
||||
$(".optionInput").removeClass("smooth");
|
||||
$(".slider").removeClass("smoothslider").removeClass("smooth");
|
||||
$(".content").removeClass("slide_up");
|
||||
$(".sideOption").removeClass("smooth");
|
||||
$(".button").removeClass("smooth");
|
||||
}
|
||||
$("#doAnimationscb").addClass("updated").on(
|
||||
"animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
|
||||
function () {
|
||||
$(this).removeClass("updated");
|
||||
}
|
||||
).prop("checked", doAnimations);
|
||||
}
|
||||
if (options.refresh_rate !== refreshRate) {
|
||||
clearInterval(statRequest);
|
||||
statRequest = setInterval(getStats, refreshRate);
|
||||
refreshRate = Math.max(options.refresh_rate, 500);
|
||||
$("#dataRefreshRate").addClass("updated").on(
|
||||
"animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
|
||||
function () {
|
||||
$(this).removeClass("updated");
|
||||
}
|
||||
).val(refreshRate);
|
||||
}
|
||||
if (options.style !== style) {
|
||||
style = options.style;
|
||||
applyStyle(options.style);
|
||||
$("#styleIn").addClass("updated").on(
|
||||
"animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
|
||||
function () {
|
||||
$(this).removeClass("updated");
|
||||
}
|
||||
);
|
||||
}
|
||||
if (options.theme !== theme) {
|
||||
theme = options.theme;
|
||||
applyTheme(options.theme);
|
||||
$("#themeIn").addClass("updated").on(
|
||||
"animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
|
||||
function () {
|
||||
$(this).removeClass("updated");
|
||||
}
|
||||
);
|
||||
}
|
||||
if (options.graph_time_frame !== graphTimeFrame) {
|
||||
graphTimeFrame = Math.max(options.graph_time_frame, 5000);
|
||||
$("#graphTimeFrame").addClass("updated").on(
|
||||
"animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
|
||||
function () {
|
||||
$(this).removeClass("updated");
|
||||
}
|
||||
).val(graphTimeFrame);
|
||||
}
|
||||
localStorage.setItem("options", JSON.stringify(options));
|
||||
}
|
||||
|
||||
function selectTab(t, l) {
|
||||
let sideBar = $("#sideBar");
|
||||
sideBar.children("div").each(function () {
|
||||
let tmp = $(this);
|
||||
if (tmp.attr("id") === t) {
|
||||
tmp.addClass("sideSelected");
|
||||
} else
|
||||
tmp.removeClass("sideSelected");
|
||||
});
|
||||
$("#content").children("div").each(function () {
|
||||
let tmp = $(this);
|
||||
if (tmp.attr("id") === l) {
|
||||
tmp.attr("hidden", false);
|
||||
} else
|
||||
tmp.attr("hidden", true);
|
||||
});
|
||||
if (sideBar.hasClass("expanded")) {
|
||||
sideBar.removeClass("expanded").addClass("retract").on(
|
||||
"animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
|
||||
function () {
|
||||
$(this).removeClass("retract").removeClass("expanded");
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
function expSide() {
|
||||
let sideBar = $("#sideBar");
|
||||
if (sideBar.hasClass("expanded")) {
|
||||
sideBar.removeClass("expanded").addClass("retract").on(
|
||||
"animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
|
||||
function () {
|
||||
$(this).removeClass("retract").removeClass("expanded");
|
||||
}
|
||||
);
|
||||
} else {
|
||||
sideBar.addClass("expand").on(
|
||||
"animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
|
||||
function () {
|
||||
$(this).addClass("expanded").removeClass("expand");
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function applyTheme(t) {
|
||||
if (doAnimations)
|
||||
$(document.body).children().each(function () {
|
||||
if (!($(this).attr("hidden")))
|
||||
$(this).addClass("tempsmooth").on(
|
||||
"webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend",
|
||||
function () {
|
||||
$(this).removeClass("tempsmooth");
|
||||
}
|
||||
);
|
||||
});
|
||||
$("#theme").attr("href", "themes/" + t + ".css");
|
||||
}
|
||||
|
||||
function applyStyle(s) {
|
||||
if (doAnimations)
|
||||
$(document.body).children().each(function () {
|
||||
if (!($(this).attr("hidden")))
|
||||
$(this).addClass("tempsmooth").on(
|
||||
"webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend",
|
||||
function () {
|
||||
$(this).removeClass("tempsmooth");
|
||||
}
|
||||
);
|
||||
});
|
||||
$("#style").attr("href", "themes/" + s + ".css");
|
||||
}
|
||||
|
||||
//update data functions
|
||||
|
||||
function getStats() {
|
||||
fetch("/api/stats")
|
||||
.then(response => response.json())
|
||||
.then(response => {
|
||||
updateValues(response);
|
||||
});
|
||||
}
|
||||
|
||||
function updateValues(data) {
|
||||
for (let key in data) {
|
||||
if (data.hasOwnProperty(key)) {
|
||||
let x = data[key];
|
||||
hitmiss.data.datasets[0].data[0] = x.cache_hits;
|
||||
hitmiss.data.datasets[0].data[1] = x.cache_misses;
|
||||
hitmiss.data.datasets[0].data[2] = x.browser_cached;
|
||||
hitmiss.update();
|
||||
req.data.labels.push(key.substring(key.indexOf("T") + 1, key.indexOf("Z")));
|
||||
req.data.datasets.forEach((dataset) => {
|
||||
dataset.data.push(x.requests_served);
|
||||
});
|
||||
req.update();
|
||||
byte.data.labels.push(key.substring(key.indexOf("T") + 1, key.indexOf("Z")));
|
||||
byte.data.datasets.forEach((dataset) => {
|
||||
dataset.data.push(x.bytes_sent);
|
||||
});
|
||||
byte.update();
|
||||
cached.data.labels.push(key.substring(key.indexOf("T") + 1, key.indexOf("Z")));
|
||||
cached.data.datasets.forEach((dataset) => {
|
||||
dataset.data.push(x.bytes_on_disk);
|
||||
});
|
||||
cached.update();
|
||||
}
|
||||
}
|
||||
let points = graphTimeFrame / refreshRate;
|
||||
if (req.data.labels.length > points) {
|
||||
req.data.labels.splice(0, req.data.labels.length - points);
|
||||
req.data.datasets.splice(0, req.data.datasets.length - points);
|
||||
}
|
||||
if (byte.data.labels.length > points) {
|
||||
byte.data.labels.splice(0, byte.data.labels.length - points);
|
||||
byte.data.datasets.splice(0, byte.data.datasets.length - points);
|
||||
}
|
||||
if (cached.data.labels.length > points) {
|
||||
cached.data.labels.splice(0, cached.data.labels.length - points);
|
||||
cached.data.datasets.splice(0, cached.data.datasets.length - points);
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 7.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 756 B |
Binary file not shown.
|
Before Width: | Height: | Size: 793 B |
Binary file not shown.
|
Before Width: | Height: | Size: 374 B |
Binary file not shown.
|
After Width: | Height: | Size: 7.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 267 B |
Binary file not shown.
|
After Width: | Height: | Size: 578 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
|
|
@ -0,0 +1,3 @@
|
|||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8.00251 14.9297L0 1.07422H6.14651L8.00251 4.27503L9.84583 1.07422H16L8.00251 14.9297Z" fill="black"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 215 B |
|
|
@ -1,104 +1 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>MD@H Client</title>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>
|
||||
<script src="dataReceive.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="layout.css">
|
||||
<link rel="stylesheet" type="text/css" href="themes/sharpStyle.css" id="style">
|
||||
<link rel="stylesheet" type="text/css" href="themes/lightTheme.css" id="theme">
|
||||
</head>
|
||||
<body>
|
||||
<div id="pageBar">
|
||||
<a href="https://mangadex.org/">
|
||||
<img src="https://mangadex.org/images/misc/navbar.svg?3" alt="mangadex" width="65px"
|
||||
height="65px" style="float: left; padding: 5px; border-radius: 50%">
|
||||
</a>
|
||||
<h1 style="position: absolute; left: 75px; margin-left: 10px">MangaDex@Home Client Interface</h1>
|
||||
<div id="consoleLatest" hidden></div>
|
||||
</div>
|
||||
<div id="sideBar" >
|
||||
<div id="expSide" class="sideOption" onclick="expSide()">
|
||||
<img src="icons/showmore.png" alt="dash" width="30px" height="30px" style="padding: 10px" class="img">
|
||||
<h2 style="position: absolute; left: 50px; top: 0; margin: calc((50px - 29px)/2)">Menu</h2>
|
||||
</div>
|
||||
<div id="dash" class="sideOption sideSelected" onclick="selectTab('dash','dashb')">
|
||||
<img src="icons/dashboard.png" alt="dash" width="30px" height="30px" style="padding: 10px" class="img">
|
||||
<h2 style="position: absolute; left: 50px; top: 50px; margin: calc((50px - 29px)/2)">Dashboard</h2>
|
||||
</div>
|
||||
<div id="opt" class="sideOption" onclick="selectTab('opt','dashOptions')">
|
||||
<img src="icons/options.png" alt="dash" width="30px" height="30px" style="padding: 10px" class="img">
|
||||
<h2 style="position: absolute; left: 50px; top: 100px; margin: calc((50px - 29px)/2)">Options</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div id="content">
|
||||
<div id="dashb" class="content" style="overflow-y: scroll">
|
||||
<div class="contentHeader">
|
||||
<h1 style="margin: 0;position:absolute; top: 42px; padding-left: 30px">Dashboard</h1>
|
||||
</div>
|
||||
<div id="pleasejustwork" style="height: calc(100% - 140px); width: calc(100% - 40px); margin: 20px">
|
||||
<div id="thelonelynumber" style="position: absolute; width: 30%; margin: 20px;">
|
||||
<div class="line_graph_data">
|
||||
<canvas id="hitpie"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div id="thegraphfamily"
|
||||
style="position: absolute; width: calc(70% - 80px); margin: 20px; left: calc(30% + 40px); top: 100px">
|
||||
<div style="margin: 20px; width: calc(100% - 40px)" class="line_graph_data">
|
||||
<canvas id="bytessent" style="height: 350px"></canvas>
|
||||
</div>
|
||||
<div style="margin: 20px; width: calc(100% - 40px)" class="line_graph_data">
|
||||
<canvas id="requestsserved" style="height: 350px"></canvas>
|
||||
</div>
|
||||
<div style="margin: 20px; width: calc(100% - 40px)" class="line_graph_data">
|
||||
<canvas id="browsercached" style="height: 350px"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="dashOptions" class="content" hidden>
|
||||
<div class="contentHeader">
|
||||
<h1 style="margin: 0;position:absolute; top: 42px; padding-left: 30px">Options</h1>
|
||||
</div>
|
||||
<div id="options">
|
||||
<h3>General</h3>
|
||||
<div class="option">
|
||||
<h4>Data Refresh Rate (ms)</h4>
|
||||
<label><input id="dataRefreshRate" type="number" class="optionInput input" placeholder="5000" min="500"></label>
|
||||
</div>
|
||||
<div class="option">
|
||||
<h4>Graph Time Frame (ms)</h4>
|
||||
<label><input id="graphTimeFrame" type="number" class="optionInput input" placeholder="30000" min="10000"></label>
|
||||
</div>
|
||||
<h3>Display</h3>
|
||||
<div class="option">
|
||||
<h4>Theme</h4>
|
||||
<label><select id="themeIn" class="optionInput input">
|
||||
<option value="lightTheme">Light</option>
|
||||
<option value="darkTheme">Dark</option>
|
||||
<option value="midnightTheme">Midnight</option>
|
||||
</select></label>
|
||||
</div>
|
||||
<div class="option">
|
||||
<h4>Style</h4>
|
||||
<label><select id="styleIn" class="optionInput input">
|
||||
<option value="sharpStyle">Sharp</option>
|
||||
<option value="softStyle">Soft</option>
|
||||
</select></label>
|
||||
</div>
|
||||
<div class="option">
|
||||
<h4>Animations</h4>
|
||||
<label class="switch switchInput">
|
||||
<input id="doAnimations" type="checkbox">
|
||||
<span id="doAnimationscb" class="slider"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<button id="apply" class="button" onclick="applyOptions()">Apply</button>
|
||||
<button id="reset" class="button" onclick="resetOptions()">Reset</button>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><!--[if IE]><link rel="icon" href="/favicon.ico"><![endif]--><title>MD@H Client</title><link rel=stylesheet href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900"><link rel=stylesheet href=https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css><link href=/css/app.e2aa2c39.css rel=preload as=style><link href=/css/chunk-vendors.21a2845f.css rel=preload as=style><link href=/js/app.dfb0f485.js rel=preload as=script><link href=/js/chunk-vendors.f7ffc240.js rel=preload as=script><link href=/css/chunk-vendors.21a2845f.css rel=stylesheet><link href=/css/app.e2aa2c39.css rel=stylesheet><link rel=icon type=image/png sizes=32x32 href=/img/icons/favicon-32x32.png><link rel=icon type=image/png sizes=16x16 href=/img/icons/favicon-16x16.png><link rel=manifest href=/manifest.json><meta name=theme-color content=#f79421><meta name=apple-mobile-web-app-capable content=yes><meta name=apple-mobile-web-app-status-bar-style content=black><meta name=apple-mobile-web-app-title content="MD@H Client Interface"><link rel=apple-touch-icon href=/img/icons/apple-touch-icon-152x152.png><link rel=mask-icon href=/img/icons/safari-pinned-tab.svg color=#f79421><meta name=msapplication-TileImage content=/img/icons/msapplication-icon-144x144.png><meta name=msapplication-TileColor content=#000000></head><body><noscript><strong>We're sorry but md_webui doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/js/chunk-vendors.f7ffc240.js></script><script src=/js/app.dfb0f485.js></script></body></html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,680 +0,0 @@
|
|||
body {
|
||||
margin: 0;
|
||||
font-family: Calibri, serif;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.smooth {
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
.tempsmooth {
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
/*Content holder positions*/
|
||||
|
||||
#pageBar {
|
||||
height: 75px;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#consoleLatest {
|
||||
position: absolute;
|
||||
min-height: 20px;
|
||||
width: calc(100% - 755px);
|
||||
margin: 30px 20px 25px 20px;
|
||||
left: 545px;
|
||||
overflow-x: scroll;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
#consoleLatest::-webkit-scrollbar {
|
||||
height: 3px;
|
||||
}
|
||||
|
||||
#connection {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
margin: 20px 20px 20px 20px;
|
||||
height: 35px;
|
||||
border-style: solid;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.connecting {
|
||||
animation: connecting 1.5s;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
@keyframes connecting {
|
||||
0%, 100% {
|
||||
filter: brightness(120%)
|
||||
}
|
||||
50% {
|
||||
filter: brightness(80%)
|
||||
}
|
||||
}
|
||||
|
||||
#sideBar {
|
||||
height: calc(100% - 75px);
|
||||
width: 50px;
|
||||
top: 75px;
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
overflow: hidden;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.sideOption {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
float: left;;
|
||||
}
|
||||
|
||||
.expand {
|
||||
animation: expand 150ms ease-out;
|
||||
-webkit-animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
.expanded {
|
||||
width: 200px !important;
|
||||
}
|
||||
|
||||
.retract {
|
||||
animation: expand 150ms reverse ease-in;
|
||||
-webkit-animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
@keyframes expand {
|
||||
0% {
|
||||
width: 50px
|
||||
}
|
||||
100% {
|
||||
width: 200px
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#content {
|
||||
height: calc(100% - 75px);
|
||||
width: calc(100% - 50px);
|
||||
top: 75px;
|
||||
left: 50px;
|
||||
position: absolute;
|
||||
/*overflow-y: auto;*/
|
||||
}
|
||||
|
||||
.contentHeader {
|
||||
width: calc(100% - 40px);
|
||||
height: 80px;
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
/*Main dashboard positions*/
|
||||
|
||||
#dashb {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#dashboard{
|
||||
position: absolute;
|
||||
margin: 20px;
|
||||
width: calc(100% - 40px);
|
||||
height: calc(100% - 140px);
|
||||
top: 100px;
|
||||
}
|
||||
|
||||
.numerical_data {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#gDat {
|
||||
height: calc(100% - 140px);
|
||||
width: calc(60% - 60px);
|
||||
margin: 20px;
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
left: calc(40% + 20px);
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
/*.line_graph_data {*/
|
||||
/* height: 100%;*/
|
||||
/* width: 100%;*/
|
||||
/*}*/
|
||||
|
||||
/*Console and options positions*/
|
||||
|
||||
#console {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#buttonBoard {
|
||||
width: calc(100% - 40px);
|
||||
height: calc(40% - 20px);
|
||||
margin: 20px;
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
}
|
||||
|
||||
#liveConsole {
|
||||
width: calc(100% - 40px);
|
||||
height: calc(60% - 180px);
|
||||
margin: 20px;
|
||||
position: absolute;
|
||||
top: calc(40% + 100px);
|
||||
padding-bottom: 40px;
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
.consoleLine {
|
||||
width: calc(100% - 5px);
|
||||
float: left;
|
||||
margin: 0 5px 0;
|
||||
left: 0;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.consoleLine > p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#console_input {
|
||||
position: absolute;
|
||||
width: calc(100% - 30px);
|
||||
height: 20px;
|
||||
bottom: 10px;
|
||||
left: 0;
|
||||
margin: 0 15px;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
white-space: nowrap;
|
||||
border-width: 0;
|
||||
outline: none;
|
||||
background-color: inherit;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#console_text {
|
||||
height: calc(100% - 40px);
|
||||
width: calc(100% - 20px);
|
||||
position: absolute;
|
||||
outline: none;
|
||||
border-width: 0;
|
||||
resize: none;
|
||||
font-family: monospace;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
padding-bottom: 40px;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
/*Web option positions*/
|
||||
#dashOptions {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#options {
|
||||
width: calc(100% - 80px);
|
||||
height: calc(100% - 140px);
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
margin: 20px 20px 20px 60px;
|
||||
}
|
||||
|
||||
#apply {
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
right: 20px;
|
||||
width: 150px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
#reset{
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
right: 190px;
|
||||
}
|
||||
|
||||
.option {
|
||||
height: 40px;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.option > h4 {
|
||||
margin: 0;
|
||||
float: left;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.optionLabel {
|
||||
|
||||
}
|
||||
|
||||
.optionInput {
|
||||
left: 200px;
|
||||
position: absolute;
|
||||
border-style: solid;
|
||||
border-width: 2px;
|
||||
}
|
||||
|
||||
.switchInput > span {
|
||||
left: 200px;
|
||||
position: absolute;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.updated {
|
||||
animation: fade 1.5s linear;
|
||||
}
|
||||
|
||||
@keyframes fade {
|
||||
0%, 100% {
|
||||
filter: alpha(100%);
|
||||
}
|
||||
100% {
|
||||
filter: alpha(0%);
|
||||
}
|
||||
}
|
||||
|
||||
/*misc modifications*/
|
||||
|
||||
.input {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.button {
|
||||
outline: none;
|
||||
border-width: 2px;
|
||||
width: 150px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.switch input {
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.slider {
|
||||
|
||||
}
|
||||
|
||||
.slider:before {
|
||||
/*border-width: 1px;*/
|
||||
position: absolute;
|
||||
content: "";
|
||||
}
|
||||
|
||||
.smoothslider:before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
-webkit-transition: .4s;
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
/*Webkit modifications*/
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button {
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-corner {
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
/*animations*/
|
||||
|
||||
.slide_up {
|
||||
animation: slideup .1s ease-out;
|
||||
}
|
||||
|
||||
@keyframes slideup {
|
||||
0% {
|
||||
transform: translateY(50px);
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
transform: translateY(0px);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/*golden layout*/
|
||||
.lm_root {
|
||||
position: relative
|
||||
}
|
||||
|
||||
.lm_row > .lm_item {
|
||||
float: left
|
||||
}
|
||||
|
||||
.lm_content {
|
||||
overflow: hidden;
|
||||
position: relative
|
||||
}
|
||||
|
||||
.lm_dragging, .lm_dragging * {
|
||||
cursor: move !important;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.lm_maximised {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 40
|
||||
}
|
||||
|
||||
.lm_maximise_placeholder {
|
||||
display: none
|
||||
}
|
||||
|
||||
.lm_splitter {
|
||||
position: relative;
|
||||
z-index: 20
|
||||
}
|
||||
|
||||
.lm_splitter:hover, .lm_splitter.lm_dragging {
|
||||
background: orange
|
||||
}
|
||||
|
||||
.lm_splitter.lm_vertical .lm_drag_handle {
|
||||
width: 100%;
|
||||
height: 15px;
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
cursor: ns-resize
|
||||
}
|
||||
|
||||
.lm_splitter.lm_horizontal {
|
||||
float: left;
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.lm_splitter.lm_horizontal .lm_drag_handle {
|
||||
width: 15px;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: -5px;
|
||||
cursor: ew-resize
|
||||
}
|
||||
|
||||
.lm_header {
|
||||
overflow: visible;
|
||||
position: relative;
|
||||
z-index: 1
|
||||
}
|
||||
|
||||
.lm_header [class^=lm_] {
|
||||
box-sizing: content-box !important
|
||||
}
|
||||
|
||||
.lm_header .lm_controls {
|
||||
position: absolute;
|
||||
right: 3px
|
||||
}
|
||||
|
||||
.lm_header .lm_controls > li {
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.lm_header ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style-type: none
|
||||
}
|
||||
|
||||
.lm_header .lm_tabs {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.lm_header .lm_tab {
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
height: 14px;
|
||||
padding: 0 25px 5px 10px;
|
||||
top: 1px;
|
||||
position: relative
|
||||
}
|
||||
|
||||
.lm_header .lm_tab i {
|
||||
width: 2px;
|
||||
height: 19px;
|
||||
position: absolute
|
||||
}
|
||||
|
||||
.lm_header .lm_tab i.lm_left {
|
||||
top: 0;
|
||||
left: -2px
|
||||
}
|
||||
|
||||
.lm_header .lm_tab i.lm_right {
|
||||
top: 0;
|
||||
right: -2px
|
||||
}
|
||||
|
||||
.lm_header .lm_tab .lm_title {
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis
|
||||
}
|
||||
|
||||
.lm_header .lm_tab .lm_close_tab {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.lm_stack.lm_left .lm_header, .lm_stack.lm_right .lm_header {
|
||||
height: 100%
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_left .lm_header, .lm_dragProxy.lm_right .lm_header, .lm_stack.lm_left .lm_header, .lm_stack.lm_right .lm_header {
|
||||
width: 20px;
|
||||
float: left;
|
||||
vertical-align: top
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_left .lm_header .lm_tabs, .lm_dragProxy.lm_right .lm_header .lm_tabs, .lm_stack.lm_left .lm_header .lm_tabs, .lm_stack.lm_right .lm_header .lm_tabs {
|
||||
transform-origin: left top;
|
||||
top: 0;
|
||||
width: 1000px
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_left .lm_header .lm_controls, .lm_dragProxy.lm_right .lm_header .lm_controls, .lm_stack.lm_left .lm_header .lm_controls, .lm_stack.lm_right .lm_header .lm_controls {
|
||||
bottom: 0
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_left .lm_items, .lm_dragProxy.lm_right .lm_items, .lm_stack.lm_left .lm_items, .lm_stack.lm_right .lm_items {
|
||||
float: left
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_left .lm_header .lm_tabs, .lm_stack.lm_left .lm_header .lm_tabs {
|
||||
transform: rotate(-90deg) scaleX(-1);
|
||||
left: 0
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_left .lm_header .lm_tabs .lm_tab, .lm_stack.lm_left .lm_header .lm_tabs .lm_tab {
|
||||
transform: scaleX(-1);
|
||||
margin-top: 1px
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_left .lm_header .lm_tabdropdown_list, .lm_stack.lm_left .lm_header .lm_tabdropdown_list {
|
||||
top: initial;
|
||||
right: initial;
|
||||
left: 20px
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_right .lm_content {
|
||||
float: left
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_right .lm_header .lm_tabs, .lm_stack.lm_right .lm_header .lm_tabs {
|
||||
transform: rotate(90deg) scaleX(1);
|
||||
left: 100%;
|
||||
margin-left: 0
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_right .lm_header .lm_controls, .lm_stack.lm_right .lm_header .lm_controls {
|
||||
left: 3px
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_right .lm_header .lm_tabdropdown_list, .lm_stack.lm_right .lm_header .lm_tabdropdown_list {
|
||||
top: initial;
|
||||
right: 20px
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_bottom .lm_header .lm_tab, .lm_stack.lm_bottom .lm_header .lm_tab {
|
||||
margin-top: 0;
|
||||
border-top: none
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_bottom .lm_header .lm_controls, .lm_stack.lm_bottom .lm_header .lm_controls {
|
||||
top: 3px
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_bottom .lm_header .lm_tabdropdown_list, .lm_stack.lm_bottom .lm_header .lm_tabdropdown_list {
|
||||
top: initial;
|
||||
bottom: 20px
|
||||
}
|
||||
|
||||
.lm_drop_tab_placeholder {
|
||||
float: left;
|
||||
width: 100px;
|
||||
height: 10px;
|
||||
visibility: hidden
|
||||
}
|
||||
|
||||
.lm_header .lm_controls .lm_tabdropdown:before {
|
||||
content: '';
|
||||
width: 0;
|
||||
height: 0;
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
border-top: 5px dashed;
|
||||
border-right: 5px solid transparent;
|
||||
border-left: 5px solid transparent;
|
||||
color: white
|
||||
}
|
||||
|
||||
.lm_header .lm_tabdropdown_list {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 0;
|
||||
z-index: 5;
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.lm_header .lm_tabdropdown_list .lm_tab {
|
||||
clear: both;
|
||||
padding-right: 10px;
|
||||
margin: 0
|
||||
}
|
||||
|
||||
.lm_header .lm_tabdropdown_list .lm_tab .lm_title {
|
||||
width: 100px
|
||||
}
|
||||
|
||||
.lm_header .lm_tabdropdown_list .lm_close_tab {
|
||||
display: none !important
|
||||
}
|
||||
|
||||
.lm_dragProxy {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 30
|
||||
}
|
||||
|
||||
.lm_dragProxy .lm_header {
|
||||
background: transparent
|
||||
}
|
||||
|
||||
.lm_dragProxy .lm_content {
|
||||
border-top: none;
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.lm_dropTargetIndicator {
|
||||
display: none;
|
||||
position: absolute;
|
||||
z-index: 20
|
||||
}
|
||||
|
||||
.lm_dropTargetIndicator .lm_inner {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 0
|
||||
}
|
||||
|
||||
.lm_transition_indicator {
|
||||
display: none;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 20
|
||||
}
|
||||
|
||||
.lm_popin {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
z-index: 9999
|
||||
}
|
||||
|
||||
.lm_popin > * {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0
|
||||
}
|
||||
|
||||
.lm_popin > .lm_bg {
|
||||
z-index: 10
|
||||
}
|
||||
|
||||
.lm_popin > .lm_icon {
|
||||
z-index: 20
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=goldenlayout-base.css.map */
|
||||
|
|
@ -0,0 +1 @@
|
|||
{"name":"MD@H Client Interface","short_name":"MD@H","theme_color":"#f79421","icons":[{"src":"./img/icons/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"./img/icons/android-chrome-512x512.png","sizes":"512x512","type":"image/png"},{"src":"./img/icons/android-chrome-maskable-192x192.png","sizes":"192x192","type":"image/png","purpose":"maskable"},{"src":"./img/icons/android-chrome-maskable-512x512.png","sizes":"512x512","type":"image/png","purpose":"maskable"}],"start_url":"/","display":"standalone","background_color":"#000000"}
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
self.__precacheManifest = (self.__precacheManifest || []).concat([
|
||||
{
|
||||
"revision": "42dc685cf939e8cb7a0e",
|
||||
"url": "/css/app.e2aa2c39.css"
|
||||
},
|
||||
{
|
||||
"revision": "b2aeed3dfb80b677859c",
|
||||
"url": "/css/chunk-vendors.21a2845f.css"
|
||||
},
|
||||
{
|
||||
"revision": "2c125ba699a0b75ad28728c89a6a4659",
|
||||
"url": "/index.html"
|
||||
},
|
||||
{
|
||||
"revision": "42dc685cf939e8cb7a0e",
|
||||
"url": "/js/app.dfb0f485.js"
|
||||
},
|
||||
{
|
||||
"revision": "b2aeed3dfb80b677859c",
|
||||
"url": "/js/chunk-vendors.f7ffc240.js"
|
||||
},
|
||||
{
|
||||
"revision": "8acb3b80fd7f13474f9b2cb074bca31a",
|
||||
"url": "/manifest.json"
|
||||
},
|
||||
{
|
||||
"revision": "b6216d61c03e6ce0c9aea6ca7808f7ca",
|
||||
"url": "/robots.txt"
|
||||
}
|
||||
]);
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
User-agent: *
|
||||
Disallow:
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
importScripts("/precache-manifest.b7ba13b46eefa1a4adbdbd28f90546f7.js", "https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js");
|
||||
|
||||
|
||||
|
|
@ -1,334 +0,0 @@
|
|||
body {
|
||||
background-color: #404040;
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
#pageBar {
|
||||
background-color: #303030;
|
||||
}
|
||||
|
||||
#consoleLatest{
|
||||
background-color: black;
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
.connected {
|
||||
border-color: #0fff00 !important;
|
||||
}
|
||||
|
||||
.disconnected {
|
||||
border-color: #e50100 !important;
|
||||
}
|
||||
|
||||
.connecting {
|
||||
border-color: #e5d700 !important;
|
||||
}
|
||||
|
||||
#sideBar {
|
||||
background-color: #303030;
|
||||
}
|
||||
|
||||
.sideOption {
|
||||
background-color: #303030;
|
||||
}
|
||||
|
||||
.sideOption:hover {
|
||||
background-color: #404040;
|
||||
}
|
||||
|
||||
.sideSelected {
|
||||
background-color: #606060;
|
||||
}
|
||||
|
||||
#content {
|
||||
background-color: #404040;
|
||||
}
|
||||
|
||||
.contentHeader {
|
||||
background-color: #606060;
|
||||
}
|
||||
|
||||
/*Main dashboard colors*/
|
||||
|
||||
#dashb {
|
||||
|
||||
}
|
||||
|
||||
#nDat {
|
||||
}
|
||||
|
||||
.numerical_data {
|
||||
background-color: #555555;
|
||||
}
|
||||
|
||||
#gDat {
|
||||
}
|
||||
|
||||
.line_graph_data {
|
||||
background-color: #555555;
|
||||
}
|
||||
|
||||
/*Console and options colors*/
|
||||
|
||||
#liveConsole {
|
||||
background-color: black;
|
||||
caret-color: #f0f0f0;
|
||||
}
|
||||
|
||||
#console_text {
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
#console_input {
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
.unsent {
|
||||
color: #e50100;
|
||||
}
|
||||
|
||||
.sent {
|
||||
color: #0fff00;
|
||||
}
|
||||
|
||||
|
||||
/*Web option colors*/
|
||||
#dashOptions {
|
||||
}
|
||||
|
||||
#options {
|
||||
}
|
||||
|
||||
.option {
|
||||
}
|
||||
|
||||
.optionLabel {
|
||||
|
||||
}
|
||||
|
||||
.optionInput {
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
background-color: #606060;
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
/*misc*/
|
||||
|
||||
.button{
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
background-color: #606060;
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
.button:hover{
|
||||
background-color: #909090;
|
||||
}
|
||||
|
||||
.img {
|
||||
filter: invert(100%);
|
||||
}
|
||||
|
||||
.updated {
|
||||
border-color: #1ec70d !important;
|
||||
}
|
||||
|
||||
.slider {
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
background-color: #606060;
|
||||
}
|
||||
|
||||
.slider::before{
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
input:checked + .slider {
|
||||
background-color: #909090;
|
||||
}
|
||||
|
||||
/*Webkit colors*/
|
||||
|
||||
::-webkit-scrollbar {
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button {
|
||||
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #555555;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #888888;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
|
||||
}
|
||||
|
||||
/*golden layout*/
|
||||
.lm_goldenlayout {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.lm_content {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.lm_dragProxy .lm_content {
|
||||
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9)
|
||||
}
|
||||
|
||||
.lm_dropTargetIndicator {
|
||||
box-shadow: inset 0 0 30px #000000;
|
||||
outline: 1px dashed #cccccc;
|
||||
transition: all 200ms ease
|
||||
}
|
||||
|
||||
.lm_dropTargetIndicator .lm_inner {
|
||||
background: #000000;
|
||||
opacity: .2
|
||||
}
|
||||
|
||||
.lm_splitter {
|
||||
background: inherit;
|
||||
opacity: .001;
|
||||
transition: opacity 200ms ease
|
||||
}
|
||||
|
||||
.lm_splitter:hover, .lm_splitter.lm_dragging {
|
||||
background: #303030;
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_header {
|
||||
background-color: #606060;
|
||||
height: 20px;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.lm_header.lm_selectable {
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.lm_header .lm_tab {
|
||||
font-size: 12px;
|
||||
color: #f0f0f0;
|
||||
background-color: #303030;
|
||||
margin-right: 2px;
|
||||
padding-bottom: 2px;
|
||||
padding-top: 1px
|
||||
}
|
||||
|
||||
.lm_header .lm_tab .lm_close_tab {
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
background-image: url("../icons/close.png");
|
||||
filter: invert(100%);
|
||||
background-size: 14px 14px;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
top: 4px;
|
||||
right: 6px;
|
||||
opacity: .4
|
||||
}
|
||||
|
||||
.lm_header .lm_tab .lm_close_tab:hover {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_header .lm_tab.lm_active {
|
||||
background-color: #909090;
|
||||
}
|
||||
|
||||
.lm_header .lm_tab.lm_active .lm_close_tab:hover {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_bottom .lm_header .lm_tab, .lm_stack.lm_bottom .lm_header .lm_tab {
|
||||
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3)
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_bottom .lm_header .lm_tab.lm_active, .lm_stack.lm_bottom .lm_header .lm_tab.lm_active {
|
||||
box-shadow: 0 2px 2px #000000
|
||||
}
|
||||
|
||||
.lm_selected .lm_header {
|
||||
background-color: #452500
|
||||
}
|
||||
|
||||
.lm_tab:hover, .lm_tab.lm_active {
|
||||
background: #202020;
|
||||
color: #f0f0f0
|
||||
}
|
||||
|
||||
.lm_header .lm_controls .lm_tabdropdown:before {
|
||||
color: #ffffff
|
||||
}
|
||||
|
||||
.lm_controls > li {
|
||||
position: relative;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
opacity: .4;
|
||||
transition: opacity 300ms ease
|
||||
}
|
||||
|
||||
.lm_controls > li:hover {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_controls .lm_popout {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAPklEQVR4nI2Q0QoAIAwCNfr/X7aXCpGN8snBdgejJOzckpkxs9jR6K6T5JpU0nWl5pSXTk7qwh8SnNT+CAAWCgkKFpuSWsUAAAAASUVORK5CYII=)
|
||||
}
|
||||
|
||||
.lm_controls .lm_maximise {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKElEQVR4nGP8////fwYCgImQAgYGBgYWKM2IR81/okwajIpgvsMbVgAwgQYRVakEKQAAAABJRU5ErkJggg==)
|
||||
}
|
||||
|
||||
.lm_controls .lm_close {
|
||||
top: 2px;
|
||||
width: 18px !important;
|
||||
height: 18px !important;
|
||||
background-image: url("../icons/close.png");
|
||||
background-size: 16px 16px;
|
||||
background-position: center center;
|
||||
filter: invert(100%);
|
||||
}
|
||||
|
||||
.lm_maximised .lm_header {
|
||||
background-color: #000000
|
||||
}
|
||||
|
||||
.lm_maximised .lm_controls .lm_maximise {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAJ0lEQVR4nGP8//8/AzGAiShVI1YhCwMDA8OsWbPwBmZaWhoj0SYCAN1lBxMAX4n0AAAAAElFTkSuQmCC)
|
||||
}
|
||||
|
||||
.lm_transition_indicator {
|
||||
background-color: #000000;
|
||||
border: 1px dashed #555555
|
||||
}
|
||||
|
||||
.lm_popin {
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.lm_popin .lm_bg {
|
||||
background: #ffffff;
|
||||
opacity: .3
|
||||
}
|
||||
|
||||
.lm_popin .lm_icon {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAJCAYAAADpeqZqAAAAWklEQVR4nJWOyw3AIAxDHcQC7L8jbwT3AlJBfNp3SiI7dtRaLSlKKeoA1oEsKSQZCEluexw8Tm3ohk+E7bnOUHUGcNh+HwbBygw4AZ7FN/Lt84p0l+yTflV8AKQyLdcCRJi/AAAAAElFTkSuQmCC);
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
border-left: 1px solid #eeeeee;
|
||||
border-top: 1px solid #eeeeee;
|
||||
opacity: .7
|
||||
}
|
||||
|
||||
.lm_popin:hover .lm_icon {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=goldenlayout-dark-theme.css.map */
|
||||
|
|
@ -1,329 +0,0 @@
|
|||
body {
|
||||
background-color: #ffffff;
|
||||
color: #202020;
|
||||
}
|
||||
|
||||
#pageBar {
|
||||
background-color: #f8f9fa;
|
||||
}
|
||||
|
||||
#consoleLatest{
|
||||
background-color: black;
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
.connected {
|
||||
border-color: #0fff00 !important;
|
||||
}
|
||||
|
||||
.disconnected {
|
||||
border-color: #e50100 !important;
|
||||
}
|
||||
|
||||
.connecting {
|
||||
border-color: #e5d700 !important;
|
||||
}
|
||||
|
||||
#sideBar {
|
||||
background-color: #f8f9fa;
|
||||
}
|
||||
|
||||
.sideOption {
|
||||
|
||||
}
|
||||
|
||||
.sideOption:hover {
|
||||
background-color: #eeeeee;
|
||||
}
|
||||
|
||||
.sideSelected {
|
||||
background-color: #e1e1e1;
|
||||
}
|
||||
|
||||
#content {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.contentHeader {
|
||||
background-color: #ededed;
|
||||
}
|
||||
|
||||
/*Main dashboard colors*/
|
||||
|
||||
#dashb {
|
||||
|
||||
}
|
||||
|
||||
#nDat {
|
||||
}
|
||||
|
||||
.numerical_data {
|
||||
background-color: #ededed;
|
||||
}
|
||||
|
||||
#gDat {
|
||||
}
|
||||
|
||||
.line_graph_data {
|
||||
background-color: #ededed;
|
||||
}
|
||||
|
||||
/*Console and options colors*/
|
||||
|
||||
#liveConsole {
|
||||
background-color: black;
|
||||
caret-color: #f0f0f0;
|
||||
}
|
||||
|
||||
#console_text {
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
#console_input {
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
.unsent {
|
||||
color: #cb0000;
|
||||
}
|
||||
|
||||
.sent {
|
||||
color: #1ec70d;
|
||||
}
|
||||
|
||||
|
||||
/*Web option colors*/
|
||||
#dashOptions {
|
||||
}
|
||||
|
||||
#options {
|
||||
}
|
||||
|
||||
.option {
|
||||
}
|
||||
|
||||
.optionLabel {
|
||||
|
||||
}
|
||||
|
||||
.optionInput {
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
background-color: #eaeaea;
|
||||
color: #202020;
|
||||
}
|
||||
|
||||
/*misc*/
|
||||
|
||||
.button{
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
background-color: #eaeaea;
|
||||
color: #202020;
|
||||
}
|
||||
|
||||
.button:hover{
|
||||
background-color: #dadada;
|
||||
}
|
||||
|
||||
.img {
|
||||
}
|
||||
|
||||
.updated {
|
||||
border-color: #1ec70d !important;
|
||||
}
|
||||
|
||||
.slider {
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
background-color: #eaeaea;
|
||||
}
|
||||
|
||||
.slider::before{
|
||||
background-color: #202020;
|
||||
}
|
||||
|
||||
input:checked + .slider {
|
||||
background-color: #adadad;
|
||||
}
|
||||
|
||||
/*Webkit colors*/
|
||||
|
||||
::-webkit-scrollbar {
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button {
|
||||
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #cacaca;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #dedede;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
|
||||
}
|
||||
|
||||
/*golden layout overrides*/
|
||||
|
||||
.lm_goldenlayout {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.lm_content {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.lm_dragProxy .lm_content {
|
||||
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9)
|
||||
}
|
||||
|
||||
.lm_dropTargetIndicator {
|
||||
box-shadow: inset 0 0 30px #000000;
|
||||
outline: 1px dashed #cccccc;
|
||||
transition: all 200ms ease
|
||||
}
|
||||
|
||||
.lm_dropTargetIndicator .lm_inner {
|
||||
background: #000000;
|
||||
opacity: .2
|
||||
}
|
||||
|
||||
.lm_splitter {
|
||||
background: inherit;
|
||||
opacity: .001;
|
||||
transition: opacity 200ms ease
|
||||
}
|
||||
|
||||
.lm_splitter:hover, .lm_splitter.lm_dragging {
|
||||
background-color: #dadada;
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_header {
|
||||
background-color: #ededed;
|
||||
height: 20px;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.lm_header.lm_selectable {
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.lm_header .lm_tab {
|
||||
font-size: 12px;
|
||||
color: #202020;
|
||||
background-color: #f8f9fa;
|
||||
margin-right: 2px;
|
||||
padding-bottom: 2px;
|
||||
padding-top: 1px
|
||||
}
|
||||
|
||||
.lm_header .lm_tab .lm_close_tab {
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
background-image: url("../icons/close.png");
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
top: 4px;
|
||||
right: 6px;
|
||||
opacity: .4
|
||||
}
|
||||
|
||||
.lm_header .lm_tab .lm_close_tab:hover {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_header .lm_tab.lm_active {
|
||||
background-color: #e1e1e1;
|
||||
}
|
||||
|
||||
.lm_header .lm_tab.lm_active .lm_close_tab:hover {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_bottom .lm_header .lm_tab, .lm_stack.lm_bottom .lm_header .lm_tab {
|
||||
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3)
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_bottom .lm_header .lm_tab.lm_active, .lm_stack.lm_bottom .lm_header .lm_tab.lm_active {
|
||||
box-shadow: 0 2px 2px #000000
|
||||
}
|
||||
|
||||
.lm_selected .lm_header {
|
||||
background-color: #452500
|
||||
}
|
||||
|
||||
.lm_tab:hover, .lm_tab.lm_active {
|
||||
background-color: #dadada;
|
||||
}
|
||||
|
||||
.lm_header .lm_controls .lm_tabdropdown:before {
|
||||
color: #ffffff
|
||||
}
|
||||
|
||||
.lm_controls > li {
|
||||
position: relative;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
opacity: .4;
|
||||
transition: opacity 300ms ease
|
||||
}
|
||||
|
||||
.lm_controls > li:hover {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_controls .lm_popout {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAPklEQVR4nI2Q0QoAIAwCNfr/X7aXCpGN8snBdgejJOzckpkxs9jR6K6T5JpU0nWl5pSXTk7qwh8SnNT+CAAWCgkKFpuSWsUAAAAASUVORK5CYII=)
|
||||
}
|
||||
|
||||
.lm_controls .lm_maximise {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKElEQVR4nGP8////fwYCgImQAgYGBgYWKM2IR81/okwajIpgvsMbVgAwgQYRVakEKQAAAABJRU5ErkJggg==)
|
||||
}
|
||||
|
||||
.lm_controls .lm_close {
|
||||
top: 2px;
|
||||
width: 10px !important;
|
||||
height: 10px !important;
|
||||
background-image: url("../icons/close.png");
|
||||
background-position: center center;
|
||||
}
|
||||
|
||||
.lm_maximised .lm_header {
|
||||
background-color: #000000
|
||||
}
|
||||
|
||||
.lm_maximised .lm_controls .lm_maximise {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAJ0lEQVR4nGP8//8/AzGAiShVI1YhCwMDA8OsWbPwBmZaWhoj0SYCAN1lBxMAX4n0AAAAAElFTkSuQmCC)
|
||||
}
|
||||
|
||||
.lm_transition_indicator {
|
||||
background-color: #000000;
|
||||
border: 1px dashed #555555
|
||||
}
|
||||
|
||||
.lm_popin {
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.lm_popin .lm_bg {
|
||||
background: #ffffff;
|
||||
opacity: .3
|
||||
}
|
||||
|
||||
.lm_popin .lm_icon {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAJCAYAAADpeqZqAAAAWklEQVR4nJWOyw3AIAxDHcQC7L8jbwT3AlJBfNp3SiI7dtRaLSlKKeoA1oEsKSQZCEluexw8Tm3ohk+E7bnOUHUGcNh+HwbBygw4AZ7FN/Lt84p0l+yTflV8AKQyLdcCRJi/AAAAAElFTkSuQmCC);
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
border-left: 1px solid #eeeeee;
|
||||
border-top: 1px solid #eeeeee;
|
||||
opacity: .7
|
||||
}
|
||||
|
||||
.lm_popin:hover .lm_icon {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=goldenlayout-dark-theme.css.map */
|
||||
|
|
@ -1,327 +0,0 @@
|
|||
body {
|
||||
background-color: #101010;
|
||||
color: #bfbfbf;
|
||||
}
|
||||
|
||||
#pageBar {
|
||||
background-color: #202020;
|
||||
}
|
||||
|
||||
#consoleLatest {
|
||||
background-color: black;
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
.connected {
|
||||
border-color: #0fff00 !important;
|
||||
}
|
||||
|
||||
.disconnected {
|
||||
border-color: #e50100 !important;
|
||||
}
|
||||
|
||||
.connecting {
|
||||
border-color: #e5d700 !important;
|
||||
}
|
||||
|
||||
#sideBar {
|
||||
background-color: #202020;
|
||||
}
|
||||
|
||||
.sideOption:hover {
|
||||
background-color: #404040;
|
||||
}
|
||||
|
||||
.sideSelected {
|
||||
background-color: #505050;
|
||||
}
|
||||
|
||||
#content {
|
||||
background-color: #101010;
|
||||
}
|
||||
|
||||
.contentHeader {
|
||||
background-color: #404040;
|
||||
}
|
||||
|
||||
/*Main dashboard colors*/
|
||||
|
||||
#dashb {
|
||||
|
||||
}
|
||||
|
||||
.numerical_data {
|
||||
background-color: #353535;
|
||||
}
|
||||
|
||||
.line_graph_data {
|
||||
background-color: #353535;
|
||||
}
|
||||
|
||||
/*Console and options colors*/
|
||||
|
||||
#liveConsole {
|
||||
background-color: black;
|
||||
caret-color: #f0f0f0;
|
||||
}
|
||||
|
||||
#console_text {
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
#console_input {
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
.unsent {
|
||||
color: #e50100;
|
||||
}
|
||||
|
||||
.sent {
|
||||
color: #0fff00;
|
||||
}
|
||||
|
||||
|
||||
/*Web option colors*/
|
||||
#dashOptions {
|
||||
}
|
||||
|
||||
#options {
|
||||
}
|
||||
|
||||
.option {
|
||||
}
|
||||
|
||||
.optionLabel {
|
||||
|
||||
}
|
||||
|
||||
.optionInput {
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
background-color: #404040;
|
||||
color: #bfbfbf;
|
||||
}
|
||||
|
||||
/*misc*/
|
||||
|
||||
.button{
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
background-color: #404040;
|
||||
color: #bfbfbf;
|
||||
}
|
||||
|
||||
.button:hover{
|
||||
background-color: #797979;
|
||||
}
|
||||
|
||||
.img {
|
||||
filter: invert(100%);
|
||||
}
|
||||
|
||||
.updated {
|
||||
border-color: #1ec70d !important;
|
||||
}
|
||||
|
||||
.slider {
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
background-color: #404040;
|
||||
}
|
||||
|
||||
.slider::before {
|
||||
background-color: #bfbfbf;
|
||||
}
|
||||
|
||||
input:checked + .slider {
|
||||
background-color: #757575;
|
||||
}
|
||||
|
||||
/*Webkit colors*/
|
||||
|
||||
::-webkit-scrollbar {
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button {
|
||||
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #555555;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #888888;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
|
||||
}
|
||||
|
||||
/*golden layout*/
|
||||
.lm_goldenlayout {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.lm_content {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.lm_dragProxy .lm_content {
|
||||
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9)
|
||||
}
|
||||
|
||||
.lm_dropTargetIndicator {
|
||||
box-shadow: inset 0 0 30px #000000;
|
||||
outline: 1px dashed #cccccc;
|
||||
transition: all 200ms ease
|
||||
}
|
||||
|
||||
.lm_dropTargetIndicator .lm_inner {
|
||||
background: #000000;
|
||||
opacity: .2
|
||||
}
|
||||
|
||||
.lm_splitter {
|
||||
background: inherit;
|
||||
opacity: .001;
|
||||
transition: opacity 200ms ease
|
||||
}
|
||||
|
||||
.lm_splitter:hover, .lm_splitter.lm_dragging {
|
||||
background: #303030;
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_header {
|
||||
background-color: #404040;
|
||||
height: 20px;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.lm_header.lm_selectable {
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.lm_header .lm_tab {
|
||||
font-size: 12px;
|
||||
color: #bfbfbf;
|
||||
background-color: #404040;
|
||||
margin-right: 2px;
|
||||
padding-bottom: 2px;
|
||||
padding-top: 1px
|
||||
}
|
||||
|
||||
.lm_header .lm_tab .lm_close_tab {
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
background-image: url("../icons/close.png");
|
||||
filter: invert(100%);
|
||||
background-size: 14px 14px;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
top: 4px;
|
||||
right: 6px;
|
||||
opacity: .4
|
||||
}
|
||||
|
||||
.lm_header .lm_tab .lm_close_tab:hover {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_header .lm_tab.lm_active {
|
||||
background-color: #606060;
|
||||
}
|
||||
.lm_header .lm_tab.lm_active:hover {
|
||||
background-color: #505050;
|
||||
}
|
||||
|
||||
.lm_header .lm_tab.lm_active .lm_close_tab:hover {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_bottom .lm_header .lm_tab, .lm_stack.lm_bottom .lm_header .lm_tab {
|
||||
box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3)
|
||||
}
|
||||
|
||||
.lm_dragProxy.lm_bottom .lm_header .lm_tab.lm_active, .lm_stack.lm_bottom .lm_header .lm_tab.lm_active {
|
||||
box-shadow: 0 2px 2px #000000
|
||||
}
|
||||
|
||||
.lm_selected .lm_header {
|
||||
background-color: #452500
|
||||
}
|
||||
|
||||
.lm_tab:hover{
|
||||
background-color: #505050;
|
||||
color: #bfbfbf
|
||||
}
|
||||
|
||||
.lm_header .lm_controls .lm_tabdropdown:before {
|
||||
color: #ffffff
|
||||
}
|
||||
|
||||
.lm_controls > li {
|
||||
position: relative;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
opacity: .4;
|
||||
transition: opacity 300ms ease
|
||||
}
|
||||
|
||||
.lm_controls > li:hover {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.lm_controls .lm_popout {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAPklEQVR4nI2Q0QoAIAwCNfr/X7aXCpGN8snBdgejJOzckpkxs9jR6K6T5JpU0nWl5pSXTk7qwh8SnNT+CAAWCgkKFpuSWsUAAAAASUVORK5CYII=)
|
||||
}
|
||||
|
||||
.lm_controls .lm_maximise {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKElEQVR4nGP8////fwYCgImQAgYGBgYWKM2IR81/okwajIpgvsMbVgAwgQYRVakEKQAAAABJRU5ErkJggg==)
|
||||
}
|
||||
|
||||
.lm_controls .lm_close {
|
||||
top: 2px;
|
||||
width: 18px !important;
|
||||
height: 18px !important;
|
||||
background-image: url("../icons/close.png");
|
||||
background-size: 16px 16px;
|
||||
background-position: center center;
|
||||
filter: invert(100%);
|
||||
}
|
||||
|
||||
.lm_maximised .lm_header {
|
||||
background-color: #000000
|
||||
}
|
||||
|
||||
.lm_maximised .lm_controls .lm_maximise {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAJ0lEQVR4nGP8//8/AzGAiShVI1YhCwMDA8OsWbPwBmZaWhoj0SYCAN1lBxMAX4n0AAAAAElFTkSuQmCC)
|
||||
}
|
||||
|
||||
.lm_transition_indicator {
|
||||
background-color: #000000;
|
||||
border: 1px dashed #555555
|
||||
}
|
||||
|
||||
.lm_popin {
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.lm_popin .lm_bg {
|
||||
background: #ffffff;
|
||||
opacity: .3
|
||||
}
|
||||
|
||||
.lm_popin .lm_icon {
|
||||
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAJCAYAAADpeqZqAAAAWklEQVR4nJWOyw3AIAxDHcQC7L8jbwT3AlJBfNp3SiI7dtRaLSlKKeoA1oEsKSQZCEluexw8Tm3ohk+E7bnOUHUGcNh+HwbBygw4AZ7FN/Lt84p0l+yTflV8AKQyLdcCRJi/AAAAAElFTkSuQmCC);
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
border-left: 1px solid #eeeeee;
|
||||
border-top: 1px solid #eeeeee;
|
||||
opacity: .7
|
||||
}
|
||||
|
||||
.lm_popin:hover .lm_icon {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=goldenlayout-dark-theme.css.map */
|
||||
|
|
@ -1,22 +0,0 @@
|
|||
.input {
|
||||
padding-left: 2px;
|
||||
}
|
||||
|
||||
.slider {
|
||||
width: 60px;
|
||||
height: 12px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.slider:before {
|
||||
height: 12px;
|
||||
width: 30px;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
input:checked + .slider:before {
|
||||
-webkit-transform: translateX(30px);
|
||||
-ms-transform: translateX(30px);
|
||||
transform: translateX(30px);
|
||||
}
|
||||
|
|
@ -1,165 +0,0 @@
|
|||
/*Content holder positions*/
|
||||
|
||||
#pageBar {
|
||||
}
|
||||
|
||||
#connection {
|
||||
}
|
||||
|
||||
#consoleLatest {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
#sideBar {
|
||||
}
|
||||
|
||||
.sideSelected {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.sideOption:hover {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
#expSide {
|
||||
}
|
||||
|
||||
#dash {
|
||||
}
|
||||
|
||||
#cons {
|
||||
}
|
||||
|
||||
#opt {
|
||||
}
|
||||
|
||||
#content {
|
||||
}
|
||||
|
||||
.contentHeader {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/*Main dashboard positions*/
|
||||
|
||||
#dashb {
|
||||
}
|
||||
|
||||
#nDat {
|
||||
|
||||
}
|
||||
|
||||
.numerical_data {
|
||||
border-radius: 0 0 10px 10px;
|
||||
}
|
||||
|
||||
#gDat {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.line_graph_data {
|
||||
border-radius: 0 0 10px 10px;
|
||||
}
|
||||
|
||||
/*Console and options positions*/
|
||||
|
||||
#console {
|
||||
}
|
||||
|
||||
#buttonBoard {
|
||||
}
|
||||
|
||||
#liveConsole {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
#console_input {
|
||||
}
|
||||
|
||||
#console_text {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/*Web option positions*/
|
||||
#dashOptions {
|
||||
}
|
||||
|
||||
#options {
|
||||
}
|
||||
|
||||
#apply {
|
||||
}
|
||||
|
||||
.option {
|
||||
}
|
||||
|
||||
.optionLabel {
|
||||
|
||||
}
|
||||
|
||||
.optionInput {
|
||||
}
|
||||
|
||||
/*misc modifications*/
|
||||
|
||||
.input {
|
||||
padding-left: 5px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.button{
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.slider {
|
||||
border-radius: 30px;
|
||||
width: 60px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.slider:before {
|
||||
border-radius: 7px;
|
||||
height: 14px;
|
||||
width: 28px;
|
||||
left: 3px;
|
||||
bottom: 1px;
|
||||
}
|
||||
|
||||
input:checked + .slider:before {
|
||||
-webkit-transform: translateX(26px);
|
||||
-ms-transform: translateX(26px);
|
||||
transform: translateX(26px);
|
||||
}
|
||||
|
||||
/*Webkit modifications*/
|
||||
|
||||
::-webkit-scrollbar {
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button {
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
}
|
||||
|
||||
/*Golden Layout Overrides*/
|
||||
|
||||
.lm_header {
|
||||
border-radius: 10px 10px 0 0;
|
||||
}
|
||||
|
||||
.lm_tabs:first-child .lm_tab{
|
||||
border-top-left-radius: 10px;
|
||||
}
|
||||
.lm_tabs:first-child .lm_tab ~ .lm_tab{
|
||||
border-top-left-radius: 0;
|
||||
}
|
||||
|
||||
.lm_splitter {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue