Skip to content

Conversation

@addy-2709genius
Copy link

Add Dark/Light Mode Toggle Feature

Implements dark/light mode toggle for p5.js test interfaces, addressing #8276.

Features:

  • One-click theme switching with persistent localStorage preference
  • Comprehensive theming for background, sidebar, and code panels
  • Works for all users (anonymous and logged-in)
  • Accessible with ARIA labels
  • Smooth CSS transitions

Files Added:

  • test/dark-mode-toggle.js - Theme switching logic
  • test/dark-mode.css - Theme styles
  • test/DARK_MODE_README.md - Documentation

Files Modified:

  • test/test.html, test/test-reference.html, test/test-minified.html - Added toggle support

All linting checks pass. Feature tested and ready for review.

Closes #8276

- Implements dark/light mode toggle functionality addressing Issue processing#8276
- Adds one-click theme switching with persistent localStorage preference
- Applies comprehensive theming to background, sidebar, and code panels
- Works for both anonymous and logged-in users
- Includes accessible toggle button with proper ARIA labels
- Adds smooth CSS transitions for theme changes

Files added:
- test/dark-mode-toggle.js: Theme switching logic
- test/dark-mode.css: Dark and light theme styles
- test/DARK_MODE_README.md: Feature documentation

Files modified:
- test/test.html: Added dark mode support
- test/test-reference.html: Added dark mode support
- test/test-minified.html: Added dark mode support
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.

Add Dark/Light Mode Toggle in p5.js Web Editor Compiler

1 participant