Add dark mode support to Python app

- Implement CSS custom properties for theming - Add comprehensive light and dark color schemes - Create theme toggle button in header - Add theme persistence with localStorage - Support system color scheme preference - Smooth transitions between themes 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-04 23:07:59 -05:00
parent 3e939a4beb
commit 178f6fa5e5
3 changed files with 161 additions and 41 deletions
--- a/static/index.html
+++ b/static/index.html
@@ -9,7 +9,12 @@
  </head>
  <body>
    <header>
-      <h1>This Little Corner — Elastic Search</h1>
+      <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px;">
+        <h1 style="margin: 0;">This Little Corner — Elastic Search</h1>
+        <button id="themeToggle" style="padding: 8px 16px; cursor: pointer; border-radius: 4px; border: 1px solid var(--color-border-primary); background: var(--color-bg-button); color: var(--color-text-primary); font-size: 14px; transition: background 0.2s;" title="Toggle dark mode">
+          🌙 Dark Mode
+        </button>
+      </div>
      <p class="muted">
        Enter a phrase to query title, description, and transcript text.
      </p>