Added overriding styles for buttons and some new colors

files/assets/css/TheMotte.css

@@ -2,6 +2,9 @@
 
 
 :root {
+	--primary: #1a6187;
+	--bright: #2384b8;
+	--very-bright: #78c0e6;
 	--dark: #c7c7c7;
 	--secondary: #c7c7c7;
 	--gray: #c7c7c7;
@@ -25,6 +28,33 @@
 	border-color: var(--primary);
 }
 
+a  { color: var(--primary); }
+
+.btn-primary { color: var(--primary); }
+.btn-primary:hover { color: var(--bright); }
+
+.btn-secondary { color: var(--primary); }
+.btn-secondary:hover { color: var(--bright); }
+
+.btn-success { color: var(--primary); }
+.btn-success:hover { color: var(--bright); }
+
+.btn-danger { color: var(--primary); }
+.btn-danger:hover { color: var(--bright); }
+
+.btn-primary.disabled, .btn-primary:disabled,
+.btn-secondary.disabled, .btn-secondary:disabled,
+.btn-success.disabled, .btn-success:disabled,
+.btn-danger.disabled, .btn-danger:disabled {
+	color: var(--muted);
+}
+
+.custom-control-input:checked ~ .custom-control-label::before {
+	opacity: 1;
+	background-color: var(--very-bright) !important;
+	border: var(--primary) solid 0.1px;
+}
+
 .border {
 	border-color: var(--primary) !important;
 }
@@ -34,6 +64,10 @@
 	border-color: var(--primary) !important;
 }
 
+.form-control:focus {
+	border-color: var(--bright) !important;
+}
+
 .btn {
 	background: transparent;
 	border-color: var(--primary) !important;

files/assets/css/main.css

@@ -584,7 +584,7 @@ a.btn.disabled, fieldset:disabled a.btn {
 	border-color: var(--primary);
 }
 .btn-primary:hover {
-	color: #fff;
+	color: var;
 	background-color: var(--primary);
 	border-color: #0062cc;
 }

files/templates/header.html

@@ -131,7 +131,7 @@
 						<div class="d-flex">
 							<div><img alt="your profile picture" loading="lazy" src="{{v.profile_url}}" class="profile-pic-35"></div>
 							<div class="text-left pl-2">
-								<div style="color: #{{v.namecolor}}" class="text-small font-weight-bold {% if v.patron %}patron{% endif %}"><span {% if v.patron %}class="patron" style="background-color:#{{v.namecolor}}"{% endif %}>{{v.username}}</span></div>
+								<div style="color: var(--bright)" class="text-small font-weight-bold {% if v.patron %}patron{% endif %}"><span {% if v.patron %}class="patron" style="background-color:#{{v.namecolor}}"{% endif %}>{{v.username}}</span></div>
 							</div>
 						</div>
 					</a>

files/templates/userpage.html

@@ -51,7 +51,7 @@
 								{% if u.unban_utc %}<h5 class="text-primary">>{{u.unban_string}}</h5>{% endif %}
 							{% endif %}
 							<div class="d-flex align-items-center mt-1 mb-2">
-								<h1 class="font-weight-bolder h3 mb-0" style="color: #{{u.namecolor}}"><span {% if u.patron %}class="patron" style="background-color:#{{u.namecolor}}"{% endif %}>{{u.username}}</span></h1>
+								<h1 class="font-weight-bolder h3 mb-0" style="color: var(--bright)"><span {% if u.patron %}class="patron" style="background-color:#{{u.namecolor}}"{% endif %}>{{u.username}}</span></h1>
 
 								{% if u.username != u.original_username %}
 								<span>