downloads API, UI

2023-02-07 21:29:19 +01:00
parent e44303eab9
commit b6c714fac7
32 changed files with 17675 additions and 5 deletions
--- a/html/ui/style.css
+++ b/html/ui/style.css
@ -0,0 +1,127 @@
+body {
+    background: white;
+}
+
+button[disabled] {
+    opacity: 0.5;
+}
+
+a[href], a[href]:visited, button.link {
+    border: none;
+    color: blue;
+    background: none;
+    cursor: pointer;
+    text-decoration: none;
+}
+
+table {
+    border-collapse: collapse;
+}
+th, td {
+    border-left:   dotted 1pt;
+    border-right:  dotted 1pt;
+    border-bottom: dotted 1pt;
+    padding: 2pt 4pt;
+}
+tr:first-child > th {
+    border-top: dotted 1pt;
+}
+th, tr:last-child > td {
+    border-bottom: solid 1pt;
+}
+
+.flat > * { margin-left: 1ex; }
+.flat > *:first-child { margin-left: 0; }
+
+.green { color: green; }
+.red   { color: red; }
+
+@media (prefers-color-scheme: dark) {
+  body {
+    background: black;
+    color: orange;
+  }
+  button, input[type=submit] {
+    background: #333;
+    color: #eee;
+  }
+  a[href], button.link {
+    border: none;
+    color: #31b0fa;
+  }
+
+  .red { color: #c00; }
+}
+
+header {
+    display: flex;
+    align-items: center;
+    border-bottom: 2pt solid;
+    margin: 0 0 1em 0;
+    padding: 1ex;
+    justify-content: space-between;
+}
+#logo > img {
+    vertical-align: middle;
+}
+header .utils > * {
+    margin-left: 1ex;
+}
+
+.error {
+    display: flex;
+    position: relative;
+    background: rgba(255,0,0,0.2);
+    border: 1pt solid red;
+    justify-content: space-between;
+    align-items: center;
+}
+.error .btn-close,
+.error .code {
+    background: #600;
+    color: white;
+    font-weight: bold;
+    border: none;
+    align-self: stretch;
+    padding: 1ex 1em;
+}
+.error .code {
+    order: 1;
+
+    display: flex;
+    align-items: center;
+    text-align: center;
+}
+.error .message {
+    order: 2;
+    padding: 1ex 2em;
+}
+.error .btn-close {
+    order: 3;
+}
+
+.sheets {
+    display: flex;
+    align-items: stretch;
+}
+.sheets > div {
+    margin: 0 1ex;
+    border: 1pt solid;
+    border-radius: 6pt;
+}
+.sheets .title {
+    text-align: center;
+    font-weight: bold;
+    font-size: large;
+    padding: 2pt 6pt;
+    background: rgba(127,127,127,0.5);
+}
+.sheets .section {
+    padding: 2pt 6pt 2pt 6pt;
+    font-weight: bold;
+    border-top: 1px dotted;
+}
+.sheets section {
+    margin: 2pt 6pt 6pt 6pt;
+}
+