1
0
mirror of https://github.com/nxshock/gron.git synced 2024-11-27 03:41:00 +05:00

WebUI format

This commit is contained in:
nxshock 2022-03-26 16:54:52 +05:00
parent 5d77188c05
commit de98867c9c

View File

@ -9,22 +9,38 @@
/* Based on base16 architecture for building themes /* Based on base16 architecture for building themes
https://github.com/chriskempson/base16 */ https://github.com/chriskempson/base16 */
:root { :root {
--base00: #282c34; /* Default Background */ /* Default Background */
--base01: #353b45; /* Lighter Background */ --base00: #282c34;
--base02: #3e4451; /* Selection Background */ /* Lighter Background */
--base03: #545862; /* Comments, Invisibles, Line Highlighting */ --base01: #353b45;
--base04: #565c64; /* Dark Foreground (Used for status bars) */ /* Selection Background */
--base05: #abb2bf; /* Default Foreground, Caret, Delimiters, Operators */ --base02: #3e4451;
--base06: #b6bdca; /* Light Foreground (Not often used) */ /* Comments, Invisibles, Line Highlighting */
--base07: #c8ccd4; /* Light Background (Not often used) */ --base03: #545862;
--base08: #e06c75; /* Red */ /* Dark Foreground (Used for status bars) */
--base09: #d19a66; /* Orange */ --base04: #565c64;
--base0A: #e5c07b; /* Yellow */ /* Default Foreground, Caret, Delimiters, Operators */
--base0B: #98c379; /* Green */ --base05: #abb2bf;
--base0C: #56b6c2; /* Aqua */ /* Light Foreground (Not often used) */
--base0D: #61afef; /* Blue */ --base06: #b6bdca;
--base0E: #c678dd; /* Purple */ /* Light Background (Not often used) */
--base0F: #be5046; /* Dark red */ --base07: #c8ccd4;
/* Red */
--base08: #e06c75;
/* Orange */
--base09: #d19a66;
/* Yellow */
--base0A: #e5c07b;
/* Green */
--base0B: #98c379;
/* Aqua */
--base0C: #56b6c2;
/* Blue */
--base0D: #61afef;
/* Purple */
--base0E: #c678dd;
/* Dark red */
--base0F: #be5046;
} }
* { * {
@ -74,11 +90,17 @@
padding: 0.25em; padding: 0.25em;
} }
td:first-child {
padding: 0;
}
table button { table button {
width: 100%; width: 100%;
color: #fff; color: var(--base07);
background-color: var(--base01); background-color: var(--base01);
border: 1px solid var(--base03); border: 0;
cursor: pointer;
padding: 0.25em;
} }
form { form {
@ -96,10 +118,11 @@
.errorbg { .errorbg {
background-color: var(--base08); background-color: var(--base08);
} }
.runningbg { .runningbg {
background-color: var(--base0B); background-color: var(--base0B);
} }
.dropbtn { .dropbtn {
background-color: var(--base01); background-color: var(--base01);
color: var(--base05); color: var(--base05);
@ -107,13 +130,13 @@
cursor: pointer; cursor: pointer;
border: 0; border: 0;
} }
.dropdown { .dropdown {
position: relative; position: relative;
display: inline-block; display: inline-block;
float: right; float: right;
} }
.dropdown-content { .dropdown-content {
display: none; display: none;
position: absolute; position: absolute;
@ -158,11 +181,14 @@
{{range .}}<tr> {{range .}}<tr>
<td> <td>
<form action="/start" method="get" id="form-{{.Name}}"></form> <form action="/start" method="get" id="form-{{.Name}}"></form>
<button{{if gt .CurrentRunningCount 0}} class="runningbg"{{else}}{{if .LastError}} class="errorbg"{{end}}{{end}} type="submit" form="form-{{.Name}}" name="jobName" value="{{.Name}}"{{if gt .CurrentRunningCount 0}} disabled{{end}}>{{.Name}}</button> <button{{if gt .CurrentRunningCount 0}} class="runningbg" {{else}}{{if .LastError}} class="errorbg"
{{end}}{{end}} type="submit" form="form-{{.Name}}" name="jobName" value="{{.Name}}" {{if gt
.CurrentRunningCount 0}} disabled{{end}}>{{.Name}}</button>
</td> </td>
<td class="smaller">{{.Description}}</td> <td class="smaller">{{.Description}}</td>
<td class="nowrap" align="right">{{.Cron}}</td> <td class="nowrap" align="right">{{.Cron}}</td>
<td>{{if gt .CurrentRunningCount 1}}running {{.CurrentRunningCount}} jobs{{else}}{{if .CurrentRunningCount}}running{{end}}{{end}}</td> <td>{{if gt .CurrentRunningCount 1}}running {{.CurrentRunningCount}} jobs{{else}}{{if
.CurrentRunningCount}}running{{end}}{{end}}</td>
<td>{{.LastStartTime}}</td> <td>{{.LastStartTime}}</td>
<td>{{.LastEndTime}}</td> <td>{{.LastEndTime}}</td>
<td align="right">{{.LastExecutionDuration}}</td> <td align="right">{{.LastExecutionDuration}}</td>