Backing up work

static/style.css

@@ -0,0 +1,166 @@
+:root {
+    --dark: #1f363dff;
+    --dark-click: #152429;
+    --mid-dark: #40798cff;
+    --mid: #70a9a1ff;
+    --mid-light: #9ec1a3ff;
+    --light: #cfe0c3ff;
+    font-family: Verdana,sans-serif;
+}
+
+body {
+    margin: 0;
+    height: 100vh;
+    display: flex;
+    flex-direction: column;
+}
+
+.header {
+    display: flex;
+    flex: 0 0 auto;
+    align-items: center;
+    justify-content: space-between;
+    background-color: var(--mid-dark);
+    padding: 0 1rem;
+    height: 80px;
+}
+
+.spacer {
+    flex: 0 0 64px;
+}
+
+.header-icon {
+    display: block;
+    flex: 0 0 64px;
+    width: 15vw;
+    height: auto;
+    max-height: 80px;
+}
+
+.title {
+    flex: 1;
+    text-align: center;
+    color: var(--light);
+}
+
+.footer {
+    background-color: var(--dark);
+    display: flex;
+    flex: 0 0 auto;
+    height: 80px;
+}
+
+.footer-text {
+    display: inherit;
+    align-content: center;
+    justify-content: center;
+    margin: auto;
+    background-color: inherit;
+    border: none;
+    outline: none;
+    text-align: center;
+    color: white;
+}
+
+.footer-text a {
+    cursor: pointer;
+    text-decoration: none;
+    color: var(--mid-light);
+    padding-left: 5px;
+}
+
+.footer-text a:hover {
+    color: var(--mid);
+}
+
+.contact-link {
+    cursor: pointer;
+    color: var(--mid-dark);
+    text-decoration: none;
+}
+
+.contact-link a:hover {
+    color: var(--mid);
+}
+
+.container {
+    flex: 1 0 auto;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 0;
+    background-image: linear-gradient(
+            to bottom right,
+            var(--mid-light),
+            var(--mid-dark)
+    );
+}
+
+.content {
+    display: flex;
+    width: 90vw;
+    max-width: 800px;
+    padding: 1.5rem;
+    background: white;
+    border-radius: 5px;
+    text-align: center;
+}
+
+.content h3 {
+    text-align: center;
+}
+
+.content p {
+    text-align: center;
+}
+
+.content input {
+    font-size: 16px;
+}
+
+.content button {
+    color: var(--dark);
+    background-color: var(--light);
+    border-radius: 8px;
+    border: 2px solid;
+    border-color: var(--dark);
+    padding: 8px 12px;
+    text-align: center;
+    text-decoration: none;
+    font-size: 16px;
+    cursor: pointer;
+}
+
+.content button:hover {
+    color: var(--light);
+    background-color: var(--dark);
+}
+
+.content button:active {
+    background-color: var(--dark-click);
+}
+
+.flex-vertical {
+    flex-direction: column;
+}
+
+.flex-horizontal {
+    flex-direction: row;
+}
+
+.hidden {
+    display: none;
+}
+
+.section-one {
+    flex: 0 0 auto;
+}
+
+.section-two {
+    display: flex;
+    flex: 1 0 auto;
+}
+
+#status {
+    margin-bottom: 0;
+}

static/verify.js

@@ -0,0 +1,35 @@
+let baseUrl = "http://localhost:8000"
+
+document.getElementById("submitBtn").addEventListener('click', function(e) {
+    let code = document.getElementById("code").value;
+    console.log("Clicked: " + code);
+
+    const path = window.location.pathname;
+    const parts = path.split("/");
+    //const user = parts.pop();
+
+    const user = "tracey"
+    fetch(baseUrl + "/api/verify/" + user, {
+        method: 'GET',
+        headers: {
+            'Content-Type': 'application/json',
+            'Authorization': "Basic " + code,
+        }
+    }).then(response => response.json())
+        .then(data => {
+            let statusText = document.getElementById("status");
+            console.log(data);
+            statusText.classList.remove("hidden");
+            if (data.status === 404) {
+                // Not found
+                statusText.innerText = "User with that code not found";
+            } else if (data.status === 200) {
+                // Display found and redirect to baseUrl/u/user/info with auth token
+                statusText.innerText = "User found, redirecting...";
+                window.location.replace(baseUrl + "/u/" + user + "/info")
+            } else {
+                // Error
+                statusText.innerText = "Error, please send this to Steven to be fixed. Error: " + data.error;
+            }
+        })
+})