basic auth

2024-11-26 11:38:28 -05:00 · 2024-11-26 11:38:28 -05:00 · 73dafb8999
commit 73dafb8999
parent 0bd8a0cfc0
8 changed files with 274 additions and 0 deletions
--- a/docs/css/main.css
+++ b/docs/css/main.css
@ -0,0 +1,67 @@
+:root {
+    --black: rgb(16, 16, 16);
+    --gray: rgb(38, 38, 38);
+    --white: rgb(240, 240, 240);
+    --primary-dark: rgb(230, 78, 78);
+    --primary-light: rgb(255, 200, 200);
+    --elem-width: min(800px, 90vw);
+    --elem-height: 300px;
+    --border-radius: 15px;
+    --font: system-ui, sans-serif;
+    color: var(--white);
+    background: var(--black);
+    font-family: var(--font) !important;
+}
+
+
+.form {
+    width: calc(var(--elem-width) - 1rem);
+    grid-template-columns: .51fr 1fr;
+    display: grid
+}
+
+.form-key {
+    margin-right: 10px
+}
+
+.form-button,
+.form-input,
+.form {
+    border: solid var(--gray) 3px;
+    background: var(--black);
+    border-radius: var(--border-radius);
+    color: var(--white);
+    padding: .5rem;
+    margin-bottom: .5rem;
+    text-decoration: none
+}
+
+.form-button,
+.form-heading,
+.form-message {
+    grid-column: span 2;
+}
+
+@media (max-width: 800px) {
+    .form {
+        grid-template-columns: 1fr;
+    }
+    .form-button, .form-heading, .form-message {
+        grid-column: span 1;
+    }
+}
+
+.form-button {
+    font-weight: 700;
+    display: inline-block;
+    background: var(--primary-dark);
+    border-color: var(--primary-light)
+}
+
+body {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    overflow-x: hidden;
+    margin-top: 0
+}