Docs: switch to dark color scheme + add dark-moke custom CSS

Matars · Matars · commit ce5e09704f06 · 2025-10-26T02:49:57.000+02:00
diff --git a/docs/_config.yml b/docs/_config.yml
@@ -6,7 +6,14 @@ baseurl: "/gitfetch"
 
 # Theme
 remote_theme: just-the-docs/just-the-docs
-color_scheme: light
+color_scheme: dark
+
+# Just-the-docs custom tweaks (used by theme when available)
+just_the_docs:
+  # visual flavor hint; not an official key but useful for future tweaks
+  flavor: "dark-moke"
+  # prefer the sidebar visible by default on large screens
+  show_sidebar: true
 
 # Just the Docs settings
 logo: "/assets/images/logo.png" # Optional logo
diff --git a/docs/assets/css/custom-dark-moke.css b/docs/assets/css/custom-dark-moke.css
@@ -0,0 +1,56 @@
+/* Custom "dark-moke" tweaks for just-the-docs
+   This file contains a few conservative overrides to nudge the
+   theme toward a darker, slightly desaturated "moke" look.
+
+   Note: The theme will only use this automatically if the layout
+   includes or links to custom CSS. If you want me to inject this
+   into the site's <head> automatically, tell me and I'll add a
+   small include that links it.
+*/
+
+:root {
+  /* slightly desaturated dark background */
+  --jtd-body-bg: #0f1113; /* near-black */
+  --jtd-page-bg: #0f1113;
+  --jtd-accent: #8ab4f8; /* soft blue accent */
+  --jtd-primary-text: #d6d7d9; /* light gray text */
+  --jtd-muted-text: #9aa0a6; /* muted text */
+  --jtd-border: rgba(255,255,255,0.06);
+}
+
+body {
+  background-color: var(--jtd-body-bg) !important;
+  color: var(--jtd-primary-text) !important;
+}
+
+/* Sidebar tweaks */
+.jtd-sidebar {
+  background-color: #0b0c0d; /* slightly darker */
+  border-right: 1px solid var(--jtd-border);
+}
+
+.jtd-sidebar a,
+.jtd-sidebar a:visited {
+  color: var(--jtd-primary-text);
+}
+
+/* Links and accents */
+a, .btn, .site-header a {
+  color: var(--jtd-accent);
+}
+
+/* Make code blocks slightly warmer */
+.highlight, pre {
+  background: #0b0c0d; /* dark */
+  color: #e6e6e6;
+}
+
+/* Make the sidebar more persistent visualy (desktop) */
+@media (min-width: 900px) {
+  .jtd-sidebar {
+    position: sticky;
+    top: 0;
+    height: 100vh;
+    overflow: auto;
+  }
+}
