Facelift

+ Light/Dark Mode
+ Theme Toggle

static/css/main.css

@@ -1,3 +1,58 @@
-#post_content {
-    height: calc(100vh - 35rem);
+:root {
+    --color-border-default: #444c56;
+    --color-fg-default: #adbac7;
+}
+
+.light body {
+    background-color: whitesmoke;
+}
+
+main#main-card {
+    max-width: 768px;
+}
+
+.light main#main-card {
+    background-color: white;
+}
+
+.dark main#main-card {
+    background-color: var(--bs-body-bg-alt);
+    border: 1px solid var(--color-border-default);
+}
+
+.dark {
+    color: var(--color-fg-default);
+}
+
+
+.dark .hidedark, .light .hidelight {
+    display: none !important;
+}
+
+#theme-toggle {
+    position: fixed;
+    top: .5rem;
+    right: .5rem;
+}
+
+
+textarea:focus,
+input[type="text"]:focus,
+input[type="password"]:focus,
+input[type="datetime"]:focus,
+input[type="datetime-local"]:focus,
+input[type="date"]:focus,
+input[type="month"]:focus,
+input[type="time"]:focus,
+input[type="week"]:focus,
+input[type="number"]:focus,
+input[type="email"]:focus,
+input[type="url"]:focus,
+input[type="search"]:focus,
+input[type="tel"]:focus,
+input[type="color"]:focus,
+.uneditable-input:focus {   
+  border-color: none;
+  box-shadow: none;
+  outline: 0 none;
 }