⭐
Log in to mark this repository.
Bring the light/dark pair over from bigtrippr, and point "system" at it
ad5582c · Gabriel Morell · 2026-09-14 02:57
Message
{commit_body(@commit)}
Files changed
modified
assets/tailwind.config.js
+61
−0
@@ -73,6 +73,67 @@ module.exports = {
| 73 | 73 | "warning": "#fef08a", |
| 74 | 74 | "error": "#fca5a5", |
| 75 | 75 | }, |
| 76 | + // The light/dark pair, ported from bigtrippr's daisyUI v5 themes so | |
| 77 | + // the family looks the same across apps. These two are what "system" | |
| 78 | + // resolves to, and the only ones declaring a `color-scheme`, so the | |
| 79 | + // browser renders form controls and scrollbars to match. | |
| 80 | + light: { | |
| 81 | + "color-scheme": "light", | |
| 82 | + "primary": "oklch(64% 0.076 19)", | |
| 83 | + "primary-content": "oklch(98% 0.010 19)", | |
| 84 | + "secondary": "oklch(55% 0.060 19)", | |
| 85 | + "secondary-content": "oklch(98% 0.010 19)", | |
| 86 | + "accent": "oklch(0% 0 0)", | |
| 87 | + "accent-content": "oklch(100% 0 0)", | |
| 88 | + "neutral": "oklch(44% 0.017 285.786)", | |
| 89 | + "neutral-content": "oklch(98% 0 0)", | |
| 90 | + "base-100": "oklch(98% 0.008 24)", | |
| 91 | + "base-200": "oklch(96% 0.014 24)", | |
| 92 | + "base-300": "oklch(92% 0.022 24)", | |
| 93 | + "base-content": "oklch(25% 0.050 24)", | |
| 94 | + "info": "oklch(62% 0.214 259.815)", | |
| 95 | + "info-content": "oklch(97% 0.014 254.604)", | |
| 96 | + "success": "oklch(70% 0.14 182.503)", | |
| 97 | + "success-content": "oklch(98% 0.014 180.72)", | |
| 98 | + "warning": "oklch(66% 0.179 58.318)", | |
| 99 | + "warning-content": "oklch(98% 0.022 95.277)", | |
| 100 | + "error": "oklch(58% 0.253 17.585)", | |
| 101 | + "error-content": "oklch(96% 0.015 12.422)", | |
| 102 | + "--rounded-box": "0.5rem", | |
| 103 | + "--rounded-btn": "0.25rem", | |
| 104 | + "--rounded-badge": "0.25rem", | |
| 105 | + "--border-btn": "1.5px", | |
| 106 | + }, | |
| 107 | + dark: { | |
| 108 | + "color-scheme": "dark", | |
| 109 | + "primary": "oklch(64% 0.076 19)", | |
| 110 | + "primary-content": "oklch(10% 0.010 19)", | |
| 111 | + "secondary": "oklch(58% 0.090 19)", | |
| 112 | + "secondary-content": "oklch(98% 0.010 19)", | |
| 113 | + // A rose in primary's hue family rather than daisyUI's violet, held | |
| 114 | + // light enough to read on a base-100 at 30% lightness -- the depth | |
| 115 | + // comes from hue and chroma, not from going literally dark. | |
| 116 | + "accent": "oklch(64% 0.135 15)", | |
| 117 | + "accent-content": "oklch(10% 0.012 15)", | |
| 118 | + "neutral": "oklch(37% 0.044 257.287)", | |
| 119 | + "neutral-content": "oklch(98% 0.003 247.858)", | |
| 120 | + "base-100": "oklch(30.33% 0.016 252.42)", | |
| 121 | + "base-200": "oklch(25.26% 0.014 253.1)", | |
| 122 | + "base-300": "oklch(20.15% 0.012 254.09)", | |
| 123 | + "base-content": "oklch(97.807% 0.029 256.847)", | |
| 124 | + "info": "oklch(58% 0.158 241.966)", | |
| 125 | + "info-content": "oklch(97% 0.013 236.62)", | |
| 126 | + "success": "oklch(60% 0.118 184.704)", | |
| 127 | + "success-content": "oklch(98% 0.014 180.72)", | |
| 128 | + "warning": "oklch(66% 0.179 58.318)", | |
| 129 | + "warning-content": "oklch(98% 0.022 95.277)", | |
| 130 | + "error": "oklch(58% 0.253 17.585)", | |
| 131 | + "error-content": "oklch(96% 0.015 12.422)", | |
| 132 | + "--rounded-box": "0.5rem", | |
| 133 | + "--rounded-btn": "0.25rem", | |
| 134 | + "--rounded-badge": "0.25rem", | |
| 135 | + "--border-btn": "1.5px", | |
| 136 | + }, | |
| 76 | 137 | }, |
| 77 | 138 | "lofi", |
| 78 | 139 | "black" |
modified
templates/_theme_toggle.html
+2
−2
@@ -5,11 +5,11 @@
| 5 | 5 | </div> |
| 6 | 6 | <ul tabindex="0" class="dropdown-content menu bg-base-200 border border-base-300 rounded-box z-10 mt-1 w-44 p-1 shadow-lg"> |
| 7 | 7 | <li><button type="button" onclick="window.dmsSetTheme('system')"><i class="fas fa-display fa-fw"></i> System</button></li> |
| 8 | − {% for theme in ["her", "afterdark", "forest", "sky", "clays", "stones", "lofi", "black"] %} | |
| 8 | + {% for theme in ["light", "dark", "her", "afterdark", "forest", "sky", "clays", "stones", "lofi", "black"] %} | |
| 9 | 9 | <li> |
| 10 | 10 | <button type="button" onclick="window.dmsSetTheme('{{ theme }}')" class="flex items-center justify-between"> |
| 11 | 11 | <span class="capitalize">{{ theme }}</span> |
| 12 | − <span class="size-3 rounded-full border border-base-content/20" data-theme="{{ theme }}" style="background: var(--color-primary)"></span> | |
| 12 | + <span class="size-3 rounded-full border border-base-content/20" data-theme="{{ theme }}" style="background: oklch(var(--p))"></span> | |
| 13 | 13 | </button> |
| 14 | 14 | </li> |
| 15 | 15 | {% endfor %} |
modified
templates/root.html
+2
−2
@@ -11,8 +11,8 @@
| 11 | 11 | <style>body { font-family: "B612 Mono", monospace; }</style> |
| 12 | 12 | <script> |
| 13 | 13 | (() => { |
| 14 | − const SYSTEM_DARK = "afterdark"; | |
| 15 | − const SYSTEM_LIGHT = "her"; | |
| 14 | + const SYSTEM_DARK = "dark"; | |
| 15 | + const SYSTEM_LIGHT = "light"; | |
| 16 | 16 | const mq = window.matchMedia("(prefers-color-scheme: dark)"); |
| 17 | 17 | const systemTheme = () => mq.matches ? SYSTEM_DARK : SYSTEM_LIGHT; |
| 18 | 18 | window.dmsSetTheme = (theme) => { |
Parents: 56f5292