fix: dark mode toggle not working - Tailwind requires class=dark

This commit is contained in:
2026-03-15 07:55:29 +08:00
parent eb233b5e4d
commit 899914d0a0

View File

@@ -70,17 +70,29 @@
{# 主题切换脚本 #}
<script>
// 初始化主题
// 初始化主题 - Tailwind darkMode: 'class' 需要 class="dark"
const savedTheme = localStorage.getItem('theme') || 'light';
document.documentElement.setAttribute('data-theme', savedTheme);
applyTheme(savedTheme);
// 应用主题
function applyTheme(theme) {
const html = document.documentElement;
if (theme === 'dark') {
html.classList.add('dark');
html.setAttribute('data-theme', 'dark');
} else {
html.classList.remove('dark');
html.setAttribute('data-theme', 'light');
}
}
// 主题切换函数
function toggleTheme() {
const html = document.documentElement;
const current = html.getAttribute('data-theme');
const next = current === 'light' ? 'dark' : 'light';
const isDark = html.classList.contains('dark');
const next = isDark ? 'light' : 'dark';
html.setAttribute('data-theme', next);
applyTheme(next);
localStorage.setItem('theme', next);
}