diff options
Diffstat (limited to 'themes/danix-xyz-hacker/layouts/partials/header.html')
| -rw-r--r-- | themes/danix-xyz-hacker/layouts/partials/header.html | 8 |
1 files changed, 6 insertions, 2 deletions
diff --git a/themes/danix-xyz-hacker/layouts/partials/header.html b/themes/danix-xyz-hacker/layouts/partials/header.html index 2ddb2e3..7f99748 100644 --- a/themes/danix-xyz-hacker/layouts/partials/header.html +++ b/themes/danix-xyz-hacker/layouts/partials/header.html @@ -48,17 +48,21 @@ <!-- Theme toggle button --> <button id="theme-toggle" + x-data="{ theme: localStorage.getItem('theme') || 'dark' }" + @click="theme = theme === 'dark' ? 'light' : 'dark'; document.documentElement.className = 'theme-' + theme; localStorage.setItem('theme', theme)" aria-label="{{ i18n "toggleTheme" }}" class="p-2 rounded hover:bg-surface transition-colors" > - <i data-feather="sun" class="w-5 h-5 hidden dark:block"></i> - <i data-feather="moon" class="w-5 h-5 block dark:hidden"></i> + <i x-show="theme === 'dark'" data-feather="sun" class="w-5 h-5" aria-hidden="true"></i> + <i x-show="theme === 'light'" data-feather="moon" class="w-5 h-5" aria-hidden="true"></i> </button> <!-- Hamburger menu button (mobile only) --> <button id="menu-toggle" aria-label="{{ i18n "toggleMenu" }}" + aria-expanded="false" + aria-controls="hamburger-menu" class="md:hidden p-2 rounded hover:bg-surface transition-colors" > <i data-feather="menu" class="w-5 h-5"></i> |