Feature/dark mode toggle #1381
Merged
Feature/dark mode toggle #1381
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- Add comprehensive dark mode CSS with CSS variables - Implement dark mode toggle button in navbar - Add JavaScript class for theme management - Include session storage persistence - Support system preference detection - Add responsive design for toggle button - Include accessibility features (ARIA labels) - Add smooth transitions between themes - Create test page for verification - Add developer integration examples - Include comprehensive documentation Features: - Toggle between light and dark themes - Session-based preference storage - Automatic system preference detection - Smooth CSS transitions - Full Bootstrap component support - Landing page theme support - Responsive design - Accessibility compliance
- Move dark mode toggle from main layout to member layout - Update CSS to integrate with SB Admin 2 theme - Add member-area-specific styling for sidebar and topbar - Update JavaScript to only initialize in member pages - Remove dark mode from public/homepage areas - Update test page and documentation to reflect member-only scope The dark mode feature is now exclusively available in the authenticated member/admin area where it's most useful for extended reading and content management sessions.
- Make striped table rows more subdued in dark theme - Add comprehensive table styling with !important overrides - Include DataTables specific dark mode support - Add member area specific table selectors - Force override any white backgrounds on tables - Improve color contrast for better readability Fixes the issue where alternating table rows were showing as white instead of subtle dark variations.
- Add inline script in _MemberLayout.cshtml head section to prevent flash of light theme - Apply dark mode preference before CSS loads to eliminate flicker on page reload - Update JavaScript to work efficiently with pre-applied theme - Update test page with anti-flicker testing features - Update documentation with anti-flicker implementation details Fixes the issue where pages would briefly show light theme before dark mode was applied.
- Restored DevBetterWeb.sln from commit before slnx upgrade - Provides backward compatibility for tools that require .sln files - Both .sln and .slnx files now coexist in the repository
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Let GitHub Copilot build this out during a devBetter coaching session on 11 July 2025.