Added basic admin page

static/css/admin.css

@@ -0,0 +1,67 @@
+body {
+    font-family: Arial, sans-serif;
+    width: 100vw;
+    height: 100vh;
+    background: #101010;
+    color: #fff;
+    display: flex;
+    align-items: center;
+    justify-content: center;  
+}
+.container {
+    background: #212121;
+    padding: 24px 32px;
+    border-radius: 8px;
+    max-width: 400px;
+    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
+}
+.active {
+    background-color: #007bff;
+    color: white;
+}
+main {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    max-width: 400px;
+    background: #121212;
+}
+nav {
+    padding: 10px 18px;
+    border-radius: 8px;
+    width: 100%;
+    box-shadow: 0 2px 8px rgba(0,0,0,0.08)
+}
+h2 {
+    margin-bottom: 20px;
+    color: #ccc;
+}
+label {
+    display: block;
+    margin-bottom: 8px;
+    font-weight: 500;
+}
+input[type="file"] {
+    margin-bottom: 16px;
+}
+button[type="submit"] {
+    background: #007bff;
+    color: #fff;
+    border: none;
+    padding: 10px 18px;
+    border-radius: 4px;
+    cursor: pointer;
+    font-size: 1rem;
+}
+button:hover {
+    background: #0056b3;
+}
+.preview {
+    margin-top: 16px;
+    max-width: 100%;
+    max-height: 200px;
+    display: none;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+}

static/css/global.css

@@ -0,0 +1,22 @@
+body {
+    margin: 0;
+    background: black;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    color: white;
+    height: 100vh;
+    cursor: none;
+}
+
+pre {
+    white-space: pre;
+    font-family: monospace;
+    font-size: 14px;
+    line-height: 1.2;
+}
+
+img {
+    max-width: 100%;
+    max-height: 100%;
+}

static/js/admin.js

@@ -0,0 +1,71 @@
+const imageInput = document.getElementById('imageInput');
+const preview = document.getElementById('preview');
+        
+let currentFile = null;
+
+        
+
+imageInput.addEventListener('change', function() {
+    currentFile = this.files[0];
+    if (currentFile) {
+        const reader = new FileReader();
+        reader.onload = function(e) {
+            preview.src = e.target.result;
+            preview.style.display = 'block';
+        }
+        reader.readAsDataURL(currentFile);
+    } else {
+        preview.style.display = 'none';
+    }
+});
+
+document.getElementById('imageForm').addEventListener('submit', function(e) {
+    e.preventDefault();
+
+    // Add your upload logic here
+    const formData = new FormData();
+    formData.append('image', currentFile);
+    if (!currentFile) {
+        alert('Please select an image to upload.');
+        return;
+    }
+    fetch('/upload', {
+        method: 'POST',
+        body: formData
+    }).then(response => response.text())
+    .then(data => {
+        console.log(data);
+        alert('Image uploaded successfully!');
+          window.location.reload();
+      })
+      .catch(error => {
+          console.error('Error:', error);
+          alert('Error uploading image.');
+   });
+});
+
+function openTab(evt, tabNumber) {
+  // Declare all variables
+  var i, tabcontent, tablinks;
+
+  // Get all elements with class="tabcontent" and hide them
+  tabcontent = document.getElementsByClassName("tab-container");
+  for (i = 0; i < tabcontent.length; i++) {
+    tabcontent[i].style.display = "none";
+  }
+
+  // Get all elements with class="tablinks" and remove the class "active"
+  tablinks = document.getElementsByClassName("tab-button");
+  for (i = 0; i < tablinks.length; i++) {
+    tablinks[i].className = tablinks[i].className.replace(" active", "");
+  }
+
+  // Show the current tab, and add an "active" class to the button that opened the tab
+  console.log("tab-"+tabNumber);
+  let currentTab = document.getElementById('tab-'+(tabNumber))
+  if (currentTab) {
+    currentTab.style.display = "block";
+  } else throw new Error("Tab not found: " + tabNumber);
+  currentTab.style.display = "block";
+  evt.currentTarget.className += " active";
+}