some changes to themes

themes/fzmin2/static/css/fonts.css

@@ -0,0 +1,9 @@
+body {
+  font-family: Verdana,sans-serif;
+  font-size: 100%;
+  line-height: 1.5;
+}
+code {
+  font-family: monospace;
+  font-size: 100%;
+}

themes/fzmin2/static/css/style.css

@@ -0,0 +1,91 @@
+
+body {
+  max-width: 800px;
+  margin: auto;
+  padding: 1em;
+  line-height: 1.5;
+  background: var(--bg0);
+  color: var(--text-color);
+}
+
+a {
+  color: var(--accent);
+}
+
+.isso-thread-heading {
+  color: var(--text-color) !important;
+}
+
+.isso-comment.isso-no-votes {
+  color: var(--text-color) !important;
+}
+
+.isso-author {
+  color: var(--text-color) !important;
+}
+
+.isso-permalink {
+  color: var(--text-color) !important;
+}
+
+.isso-downvote {
+  color: white;
+}
+
+/* header and footer areas */
+.menu { padding: 0; }
+.menu li { display: inline-block;}
+.article-meta, .menu a {
+  text-decoration: none;
+  background: var(--bg1); 
+  padding: 5px;
+  border-radius: 5px;
+}
+.menu h1 {
+  border-left: 4px solid var(--accent);
+}
+.menu a:hover {
+  border-bottom: solid var(--accent);
+}
+.article-meta, footer { text-align: center;}
+.title { font-size: 1.1em; }
+footer a { text-decoration: none; }
+hr {
+  border-style: dashed;
+  color: #ddd;
+}
+
+/* code */
+pre {
+  border: 1px solid #ddd;
+  /*box-shadow: 5px 5px 5px #eee;*/
+  padding: 1em;
+    overflow-x: auto;
+}
+code { background: none; }
+pre code { background: none; }
+
+/* misc elements */
+img, iframe, video { max-width: 100%; margin-bottom: none; }
+main { hyphens: auto; }
+blockquote {
+  background: #f9f9f9;
+  border-left: 5px solid #ccc;
+  padding: 3px 1em 3px;
+}
+
+table {
+  margin: auto;
+}
+table thead th { border-bottom: 1px solid var(--bg3); }
+th, td { padding: 5px; }
+thead, tfoot, tr:nth-child(even) { background: var(--bg3); }
+ul {margin-top: none;}
+
+.post h3 {
+  margin-bottom: 0.2rem;
+}
+
+.post .date {
+  font-size: 12px;
+}

themes/fzmin2/static/css/themes/1337.css

@@ -0,0 +1,8 @@
+:root {
+    --text-color: rgb(0, 255, 0);
+    --accent: rgb(0, 255, 0);
+    --bg0: black;
+    --bg1: black;
+    --bg2: black;
+    --bg3: black;
+}

themes/fzmin2/static/css/themes/default.css

@@ -0,0 +1,8 @@
+:root {
+    --text-color: #fdfaff;
+    --accent: #f12a2a;
+    --bg0: #221c1c;
+    --bg1: #292323;
+    --bg2: #332b2b;
+    --bg3: #645959;
+}

themes/fzmin2/static/css/themes/red.css

@@ -0,0 +1,8 @@
+:root {
+    --text-color: #fdfaff;
+    --accent: #ff4949;
+    --bg0: #110e0e;
+    --bg1: #292323;
+    --bg2: #131010;
+    --bg3: #2e2a2a;
+}

themes/fzmin2/static/css/themes/red2.css

@@ -0,0 +1,8 @@
+:root {
+    --text-color: #fdfaff;
+    --accent: #f12a2a;
+    --bg0: #221c1c;
+    --bg1: #292323;
+    --bg2: #332b2b;
+    --bg3: #645959;
+}

themes/fzmin2/static/css/themes/winter.css

@@ -0,0 +1,8 @@
+:root {
+    --text-color: #222627;
+    --accent: #33c5ff;
+    --bg0: #eafeff;
+    --bg1: #d3fcff;
+    --bg2: #d6f7ff;
+    --bg3: #defaff;
+}

themes/fzmin2/static/css/themes/xmin.css

@@ -0,0 +1,8 @@
+:root {
+    --text-color: black;
+    --accent: #666;
+    --bg0: #eee;
+    --bg1: #ddd;
+    --bg2: #ddd;
+    --bg3: #f9f9f9;
+}

themes/fzmin2/static/js/themes.js

@@ -0,0 +1,19 @@
+const themes = ['default', 'xmin', 'winter', '1337', 'red']
+
+themes.forEach(theme => {
+    document.getElementById("themes").insertAdjacentHTML('afterbegin', "<option id='" + theme + "'>" + theme + "</option>" )
+});
+
+function changeClientTheme(theme) {
+    let link = document.createElement("link");
+    link.rel = "stylesheet";
+    link.href = "/css/themes/" + theme + ".css";
+    document.head.appendChild(link);
+}
+
+function changetheme() {
+    localStorage.setItem("theme", document.getElementById('themes').value);
+    changeClientTheme(document.getElementById('themes').value)
+}
+
+changeClientTheme(localStorage.getItem('theme'))