diff --git a/server/index.go b/server/index.go index d755dd8..7e99879 100644 --- a/server/index.go +++ b/server/index.go @@ -56,7 +56,8 @@ func handleIndex(w http.ResponseWriter, r *http.Request) { if err != nil { size = 0 } - data.Counter = splitInt(size) + // data.Counter = splitInt(size) + data.Counter = []int{0, 1, 2, 3, 4, 5, 6, 7, 8, 9} buf := bytes.Buffer{} err = templates.ExecuteTemplate(&buf, constants.INDEX_TEMPLATE_NAME, data) diff --git a/static/style/color.css b/static/style/color.css new file mode 100644 index 0000000..b726731 --- /dev/null +++ b/static/style/color.css @@ -0,0 +1,9 @@ +:root { + --cl-bg: #111; + --cl-fg: #eee; + --cl-el: #333; + --cl-hl: #222; + + background: var(--cl-bg); + color: var(--cl-fg); +} \ No newline at end of file diff --git a/static/style/component.css b/static/style/component.css new file mode 100644 index 0000000..55f660e --- /dev/null +++ b/static/style/component.css @@ -0,0 +1,68 @@ +/* Inputs */ +input, select, :is(button, .button) { + background: var(--cl-el); + border: 1px solid var(--cl-fg); + padding: 0.125rem; +} + +:is(button, .button, input[type=submit]) { + display: flex; + text-align: center; + text-decoration: none; + align-items: center; +} + +:is(button, .button, input[type=submit]):hover { + background-color: var(--cl-hl); + cursor: pointer; +} + +/* Forms */ +:is(form, .form) { + display: grid; + grid-template-columns: auto 1fr; + gap: 0.5rem; + align-self: start; +} + +:is(form, .form) > :is(p, label) { + grid-column: 1; +} + +:is(form, .form) > :is(button, .button, input[type=submit]) { + grid-column: 1 / 3; +} + +:is(form, .form) > :is(input[type=checkbox], :is(p, label)) { + place-self: center start; +} + +/* Tables */ +table { + border-collapse: collapse; +} + +th, td { + background: var(--cl-el); + border: 1px solid var(--cl-fg); + padding: 0.25rem; +} + +tr:hover > td { + background: var(--cl-hl); +} + +tr:hover[onclick] > td { + cursor: pointer; +} + +/* Navigation */ +nav { + flex-flow: row nowrap; + background: var(--cl-el); +} + +nav > :is(button, .button, input[type=submit]) { + border: none; + padding: 0.5rem; +} diff --git a/static/style/mlfe.css b/static/style/mlfe.css new file mode 100644 index 0000000..68c0bbe --- /dev/null +++ b/static/style/mlfe.css @@ -0,0 +1,42 @@ +/* MLFE: Marginless FlexEverything (A CSS Reset for Layout) */ +:root { + font-family: sans-serif; + line-height: 1; + user-select: none; +} + +* { + box-sizing: border-box; + padding: 0px; + margin: 0px; + user-select: inherit; + color: inherit; + overflow: hidden; + flex-shrink: 0; + font-family: inherit; /* + */ + fonz-size: 1rem; /* + */ +} + +/* Change from normal: Body and label added as flex container */ +div, ul, ol, nav, body, label { + display: flex; + flex-direction: column; + flex-wrap: nowrap; +} + +h1 { font-size: calc(1rem + calc(1rem / 1))} +h2 { font-size: calc(1rem + calc(1rem / 2))} +h3 { font-size: calc(1rem + calc(1rem / 3))} +h4 { font-size: calc(1rem + calc(1rem / 4))} +h5 { font-size: calc(1rem + calc(1rem / 5))} +h6 { font-size: calc(1rem + calc(1rem / 6))} + +ul, ol { + gap: 0.5rem; + padding-left: 1rem; +} + +/* Fix text getting cut off unpredictably */ +h1, h2, h3, h4, h5, h6, pre, p, label, legend { + overflow: visible; +} diff --git a/static/style/style.css b/static/style/style.css index b0e29f3..773cca8 100644 --- a/static/style/style.css +++ b/static/style/style.css @@ -1,74 +1,50 @@ -ul { - list-style-type: none; - margin: 0; - padding: 0; - overflow: hidden; - background-color: #333; -} +@import url("mlfe.css"); +@import url("color.css"); +@import url("component.css"); -li { - float: left; -} - -li a { - display: block; - color: white; - background-color: #333; - text-align: center; - padding: 14px 16px; - text-decoration: none; -} - -/* Change the link color to #111 (black) on hover */ -li a:hover { - background-color: #111; -} - - -* { - background-color: black; - color: white; +:root { font-family: monospace; + font-size: 16px; } - -.counter { - display: flex; -} - -.worker-list { - display: flex; - gap: 5px; - flex-wrap: wrap; +body { + padding: 0.5rem; + gap: 0.5rem; } .counter-image { - image-rendering: pixelated; - image-rendering: -moz-crisp-edges; - image-rendering: crisp-edges; - flex-grow: 200; + image-rendering: pixelated; + image-rendering: -moz-crisp-edges; + image-rendering: crisp-edges; + flex-grow: 1; } -.worker table{ - border: 1px solid white; - border-collapse: collapse; - border-spacing: 5px; +.counter { + flex-flow: row nowrap; + align-items: end; + font-size: 1.5rem; + font-weight: bold; } -.worker td{ - border: 1px solid white; +.workers { + flex-flow: row wrap; } -.worker tr{ - border: 1px solid white; +.workers > * { + gap: 0.5rem; + border: 1px solid var(--fg); } -.task-list table{ - border: 1px solid white; - border-collapse: collapse; - border-spacing: 5px; +.log > p { + padding: 0.25rem 0; + user-select: text; } -.task-list tr{ - border: 1px solid white; -} \ No newline at end of file +.log > p:hover { + background: var(--cl-hl); +} + +nav > :first-child { + font-size: 2rem; + font-weight: bold; +} diff --git a/tmpl/index.tmpl b/tmpl/index.tmpl index 506110f..8471c0d 100644 --- a/tmpl/index.tmpl +++ b/tmpl/index.tmpl @@ -1,5 +1,5 @@ {{template "head"}} -
+
{{ $l := len .Counter }} {{range $i, $c := .Counter}} {{$c}} @@ -16,9 +16,9 @@ {{end}}

Workers

-
+
{{range $w := .Workers}} -
+

{{ $w.Name }}

diff --git a/tmpl/libraries.tmpl b/tmpl/libraries.tmpl index 9a87455..3baf9b7 100644 --- a/tmpl/libraries.tmpl +++ b/tmpl/libraries.tmpl @@ -1,40 +1,38 @@ {{template "head"}}

Libraries

-
-
- - - - - - - {{range $l := .Libraries}} - - - - - - - {{end}} -
IDNamePathEnable
- {{ $l.ID }} - - {{ $l.Name }} - - {{ $l.Path }} - - {{ $l.Enable }} -
-
+ + + + + + + + {{range $l := .Libraries}} + + + + + + + {{end}} +
IDNamePathEnabled
+ {{ $l.ID }} + + {{ $l.Name }} + + {{ $l.Path }} + + {{ $l.Enable }} +

New Library

-
-
-
-
-
-
- + + + + + + +
{{template "tail"}} \ No newline at end of file diff --git a/tmpl/library.tmpl b/tmpl/library.tmpl index 0f39886..e216ff4 100644 --- a/tmpl/library.tmpl +++ b/tmpl/library.tmpl @@ -1,6 +1,6 @@ {{template "head"}}

Library {{.Library.Name}}

-

Enabled {{.Library.Enable}} +

{{if .Library.Enable}}Enabled{{else}}Disabled{{end}}

Files

diff --git a/tmpl/navbar.tmpl b/tmpl/navbar.tmpl index 86814b0..1c97513 100644 --- a/tmpl/navbar.tmpl +++ b/tmpl/navbar.tmpl @@ -1,7 +1,7 @@ {{define "navbar"}} - + {{end}} \ No newline at end of file diff --git a/tmpl/task.tmpl b/tmpl/task.tmpl index 118bc2d..707694b 100644 --- a/tmpl/task.tmpl +++ b/tmpl/task.tmpl @@ -1,9 +1,11 @@ {{template "head"}}

Task {{.ID}}

-
+
{{range $t := .Log}} - {{ $t }}
+

+ {{ $t }} +

{{end}}
{{template "tail"}} \ No newline at end of file diff --git a/tmpl/tasks.tmpl b/tmpl/tasks.tmpl index 9a9009d..4ae8423 100644 --- a/tmpl/tasks.tmpl +++ b/tmpl/tasks.tmpl @@ -1,24 +1,24 @@ {{template "head"}}

New Tasks

-
+
-
+ +
-
+ +
- + + +

Task Stats

@@ -35,42 +35,40 @@ Total: {{.Stats.TotalCount}}

Tasks

-
- - - - - - - - - - - {{range $t := .Tasks}} - - - - - - - - - - {{end}} -
IDLibraryWorkerTypeStatusFileUpdated At
- {{ $t.ID }} - - {{ $t.Library }} - - {{ $t.Worker }} - - {{ $t.Type }} - - {{ $t.Status }} - - {{ $t.File }} - - {{ $t.UpdatedAt }} -
-
+ + + + + + + + + + + {{range $t := .Tasks}} + + + + + + + + + + {{end}} +
IDLibraryWorkerTypeStatusFileUpdated At
+ {{ $t.ID }} + + {{ $t.Library }} + + {{ $t.Worker }} + + {{ $t.Type }} + + {{ $t.Status }} + + {{ $t.File }} + + {{ $t.UpdatedAt }} +
{{template "tail"}} \ No newline at end of file