feat: move theme switcher from header to footer#162
Merged
ManukMinasyan merged 3 commits intomainfrom Feb 25, 2026
Merged
Conversation
There was a problem hiding this comment.
Pull request overview
Moves theme selection UI out of the header and replaces it with a consistent 3-state theme switcher (System/Light/Dark) placed in the footer and mobile menu, while also adjusting the auth-links responsive breakpoint so links appear at tablet widths.
Changes:
- Removed the header dark/light toggle button and introduced a 3-option theme switcher driven by
localStorage+ system preference. - Added the theme switcher control to the footer and mobile menu footer sections.
- Updated the header auth-links breakpoint from
lgtomdto show “Sign In / Start for free” on tablet.
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| resources/views/components/layout/mobile-menu.blade.php | Replaces the mobile theme toggle with the new 3-option segmented theme control. |
| resources/views/components/layout/header.blade.php | Removes header toggle UI, updates auth breakpoint, and implements shared theme management JS for .theme-btn. |
| resources/views/components/layout/footer.blade.php | Adds the 3-option segmented theme control to the footer copyright row. |
- Extract duplicated theme switcher markup into <x-theme-switcher> Blade component - Use Alpine.js x-data for theme state instead of vanilla JS class toggling - Leverage Tailwind v4 aria-pressed: variant for active button styling - Move FOUC prevention script from header component to guest layout <head> - Remove ~55 lines of vanilla JS theme management from header - Sync multiple switcher instances via Alpine @theme-changed.window event
Consistently store 'system' in localStorage instead of removing the key, preventing mismatch with Filament panel theme storage. Update FOUC script to handle the explicit 'system' value.
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
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.
Summary
lg:flextomd:flexso Sign In / Start for Free are visible at tablet sizes (768-1024px)Test plan