Skip to content

Add dark mode toggle to top navigation bar#4

Open
luaroncrew wants to merge 3 commits into
mainfrom
add-dark-mode-toggle
Open

Add dark mode toggle to top navigation bar#4
luaroncrew wants to merge 3 commits into
mainfrom
add-dark-mode-toggle

Conversation

@luaroncrew
Copy link
Copy Markdown
Owner

Summary

  • Adds a sticky top navigation bar with VibeTrader branding (logo left, toggle right)
  • Dark/light mode toggle button (🌙/☀️) in the top-right corner
  • Light theme defined via [data-theme="light"] CSS variable overrides on <html>
  • Preference persisted to localStorage (key: vt-theme) and restored on page load with no flash

Test plan

  • Toggle switches between dark and light themes visually
  • Preference survives page refresh
  • All signal colors (BUY/SELL/HOLD) remain readable in both themes
  • Nav bar stays sticky on scroll

luaroncrew and others added 3 commits March 28, 2026 15:24
- Fixed sun/moon SVG button (top-right corner) on both UIs
- Light theme overrides CSS vars via html[data-theme="light"]
- Preference persisted in localStorage under key vt-theme
- No external dependencies

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Kept remote's topnav structure, replaced emoji with inline SVG sun/moon
icons consistent with frontend/index.html implementation.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant