Add TheMotte theme and make it default.

I created a new theme, "TheMotte" in /assests/css. Someone with any design
skill at all should try improving this. Currently it is a copy of light.css

__main__.py defines the experience for a user without an account. I removed the
check for an OS environment variable, and defaulted to the new theme.

/classes/user.py defines the default for a new account. I removed the check for an OS
environment variable, and defaulted to the new theme.

/routes/settings.py has a list of the themes that checks them for... something.
I added the new one here, just in case.

/templates/settings_profile.html has a hardcoded list that controls which
themes appear in the user settings page. Added the new theme here, so you can
select it.

files/__main__.py

@@ -38,7 +38,7 @@ app.config["SESSION_COOKIE_SECURE"] = True
 app.config["SESSION_COOKIE_SAMESITE"] = "Lax"
 app.config["PERMANENT_SESSION_LIFETIME"] = 60 * 60 * 24 * 365
 app.config["DEFAULT_COLOR"] = environ.get("DEFAULT_COLOR", "ff0000").strip()
-app.config["DEFAULT_THEME"] = environ.get("DEFAULT_THEME", "midnight").strip()
+app.config["DEFAULT_THEME"] = "TheMotte"
 app.config["FORCE_HTTPS"] = 1
 app.config["UserAgent"] = "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.107 Safari/537.36"
 app.config["HCAPTCHA_SITEKEY"] = environ.get("HCAPTCHA_SITEKEY","").strip()

files/assets/css/TheMotte.css

@@ -0,0 +1,85 @@
+@charset "UTF-8";
+
+
+:root {
+	--dark: #c7c7c7;
+	--secondary: #c7c7c7;
+	--gray: #c7c7c7;
+	--gray-300: #c7c7c7;
+	--gray-400: #cfcfcf;	
+	--gray-500: #ffffff;
+	--gray-600: #ffffff;
+	--gray-700: #ffffff;
+	--gray-800: #ffffff;
+	--gray-900: #ffffff;
+	--light: #ffffff;
+	--muted: #1e1e1e;
+	--gray-100: #1e1e1e;
+	--gray-200: #1e1e1e;
+	--white: #1e1e1e;
+	--black: #303030;
+	--background: #ffffff;
+}
+
+* {
+	border-color: var(--primary);
+}
+
+.border {
+	border-color: var(--primary) !important;
+}
+
+.form-control {
+	background: transparent;
+	border-color: var(--primary) !important;
+}
+
+.btn {
+	background: transparent;
+	border-color: var(--primary) !important;
+}
+
+.form-control:disabled, .form-control[readonly] {
+	background: transparent;
+	border-color: var(--primary) !important;
+}
+
+.btn-success {
+	border-color: #38A169 !important;
+}
+
+.btn-danger {
+	border-color: #E53E3E !important;
+}
+
+#frontpage .pseudo-submit-form.card .card-body .form-control {
+	border-color: transparent !important;
+}
+
+.btn-lg {
+	border-color: transparent !important;
+}
+
+pre {
+	color: #CFCFCF;
+}
+
+.transparent {
+	background: None !important;
+}
+
+blockquote {
+	color: var(--gray-400);
+}
+
+#profilestuff > * {
+	color: var(--gray-400) !important;
+}
+
+.comment-anchor:target, .unread {
+	background: #00000055 !important;
+}
+
+#frontpage .post-title a:visited, .visited {
+	color: #7a7a7a !important;
+}

files/classes/user.py

@@ -22,7 +22,8 @@ from files.helpers.security import *
 import random
 from os import environ, remove, path
 
-defaulttheme = environ.get("DEFAULT_THEME", "midnight").strip()
+
+defaulttheme = "TheMotte"
 defaulttimefilter = environ.get("DEFAULT_TIME_FILTER", "all").strip()
 cardview = bool(int(environ.get("CARD_VIEW", 1)))
 

files/routes/settings.py

@@ -278,7 +278,9 @@ def settings_profile_post(v):
 
 	theme = request.values.get("theme")
 	if theme:
-		if theme in {"dramblr", "reddit", "classic", "classic_dark", "transparent", "win98", "dark", "light", "coffee", "tron", "4chan", "midnight"}:
+		if theme in {"TheMotte", "dramblr", "reddit", "classic", "classic_dark",
+			"transparent", "win98", "dark", "light", "coffee", "tron", "4chan",
+			"midnight"}:
 			if theme == "transparent" and not v.background: 
 				return {"error": "You need to set a background to use the transparent theme!"}
 			v.theme = theme

files/templates/settings_profile.html

@@ -77,7 +77,7 @@
 							<div class="input-group mb2">
 								<select autocomplete="off" id='theme' class="form-control" form="profile-settings" name="theme" onchange="post_toast(this,'/settings/profile?theme='+document.getElementById('theme').value, '1')">
 								
-								{% set themes = ["dramblr", "reddit", "transparent", "win98", "dark", "light", "coffee", "tron", "4chan", "midnight"] %}
+								{% set themes = ["TheMotte", "dramblr", "reddit", "transparent", "win98", "dark", "light", "coffee", "tron", "4chan", "midnight"] %}
 								
 								{% for entry in themes %}
 									<option value="{{entry}}" {% if v.theme==entry %} selected {% endif %}>
@@ -624,3 +624,4 @@
 {% include "gif_modal.html" %}
 
 {% endblock %}
+