Merge branch 'webui' into 'master'
Webui See merge request mangadex/mangadex_at_home!30
|
@ -6,9 +6,15 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||||
|
|
||||||
## [Unreleased]
|
## [Unreleased]
|
||||||
### Added
|
### 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
|
### Changed
|
||||||
- [2020-06-16] Reworked graceful shutdown [@carbotaniuman].
|
- [2020-06-16] Reworked graceful shutdown [@carbotaniuman].
|
||||||
|
- [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
|
### Deprecated
|
||||||
|
|
||||||
|
|
|
@ -7,6 +7,7 @@ import java.time.Duration
|
||||||
object Constants {
|
object Constants {
|
||||||
const val CLIENT_BUILD = 8
|
const val CLIENT_BUILD = 8
|
||||||
const val CLIENT_VERSION = "1.0"
|
const val CLIENT_VERSION = "1.0"
|
||||||
|
const val WEBUI_VERSION = "0.0.4"
|
||||||
val MAX_AGE_CACHE: Duration = Duration.ofDays(14)
|
val MAX_AGE_CACHE: Duration = Duration.ofDays(14)
|
||||||
@JvmField
|
@JvmField
|
||||||
val GSON: Gson = GsonBuilder().setPrettyPrinting().create()
|
val GSON: Gson = GsonBuilder().setPrettyPrinting().create()
|
||||||
|
|
1
src/main/resources/webui/css/app.e2aa2c39.css
Normal file
|
@ -0,0 +1 @@
|
||||||
|
::-webkit-scrollbar{width:0}
|
5
src/main/resources/webui/css/chunk-vendors.21a2845f.css
Normal file
|
@ -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);
|
|
||||||
}
|
|
||||||
}
|
|
BIN
src/main/resources/webui/favicon.ico
Normal file
After Width: | Height: | Size: 7.3 KiB |
Before Width: | Height: | Size: 756 B |
Before Width: | Height: | Size: 793 B |
Before Width: | Height: | Size: 374 B |
BIN
src/main/resources/webui/img/icons/android-chrome-192x192.png
Normal file
After Width: | Height: | Size: 7.3 KiB |
BIN
src/main/resources/webui/img/icons/android-chrome-512x512.png
Normal file
After Width: | Height: | Size: 21 KiB |
After Width: | Height: | Size: 9.4 KiB |
After Width: | Height: | Size: 24 KiB |
BIN
src/main/resources/webui/img/icons/apple-touch-icon-120x120.png
Normal file
After Width: | Height: | Size: 3.3 KiB |
BIN
src/main/resources/webui/img/icons/apple-touch-icon-152x152.png
Normal file
After Width: | Height: | Size: 4 KiB |
BIN
src/main/resources/webui/img/icons/apple-touch-icon-180x180.png
Normal file
After Width: | Height: | Size: 4.6 KiB |
BIN
src/main/resources/webui/img/icons/apple-touch-icon-60x60.png
Normal file
After Width: | Height: | Size: 1.5 KiB |
BIN
src/main/resources/webui/img/icons/apple-touch-icon-76x76.png
Normal file
After Width: | Height: | Size: 1.8 KiB |
BIN
src/main/resources/webui/img/icons/apple-touch-icon.png
Normal file
After Width: | Height: | Size: 4.6 KiB |
BIN
src/main/resources/webui/img/icons/favicon-16x16.png
Normal file
After Width: | Height: | Size: 267 B |
BIN
src/main/resources/webui/img/icons/favicon-32x32.png
Normal file
After Width: | Height: | Size: 578 B |
After Width: | Height: | Size: 1.1 KiB |
BIN
src/main/resources/webui/img/icons/mstile-150x150.png
Normal file
After Width: | Height: | Size: 4.2 KiB |
3
src/main/resources/webui/img/icons/safari-pinned-tab.svg
Normal file
|
@ -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>
|
<!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>
|
||||||
<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>
|
|
2
src/main/resources/webui/js/app.dfb0f485.js
Normal file
1
src/main/resources/webui/js/app.dfb0f485.js.map
Normal file
297
src/main/resources/webui/js/chunk-vendors.f7ffc240.js
Normal file
|
@ -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 */
|
|
1
src/main/resources/webui/manifest.json
Normal file
|
@ -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"
|
||||||
|
}
|
||||||
|
]);
|
2
src/main/resources/webui/robots.txt
Normal file
|
@ -0,0 +1,2 @@
|
||||||
|
User-agent: *
|
||||||
|
Disallow:
|
3
src/main/resources/webui/sw.js
Normal file
|
@ -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;
|
|
||||||
}
|
|
||||||
|
|