修复深色与浅色主题无法切换的问题

修正 CSS 选择器避免 :root 始终应用深色变量，并改进 theme.js 点击绑定与首屏主题恢复。 Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-15 16:29:34 +08:00
parent 2b383b84ce
commit 0e385b057d
3 changed files with 34 additions and 14 deletions
@@ -1,12 +1,18 @@
 <!DOCTYPE html>
-<html lang="zh-CN">
+<html lang="zh-CN" data-theme="dark">
 <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>系统登录</title>
+    <script>
+    try {
+        var _t = localStorage.getItem('qihuo-theme');
+        if (_t === 'light' || _t === 'dark') document.documentElement.setAttribute('data-theme', _t);
+    } catch (e) { /* ignore */ }
+    </script>
    <script src="{{ url_for('static', filename='js/theme.js') }}"></script>
    <style>
-        :root,[data-theme="dark"]{
+        html:not([data-theme="light"]){
            --bg-page:#050508;
            --bg-grid:rgba(76,194,255,.045);
            --card-bg:rgba(10,12,22,.88);
@@ -80,7 +86,7 @@
        .theme-switch-btn{
            padding:.38rem .75rem;border:none;border-radius:999px;
            background:transparent;color:var(--text-muted);
-            font-size:.75rem;cursor:pointer;transition:.2s;
+            font-size:.75rem;cursor:pointer;transition:.2s;width:auto;
        }
        .theme-switch-btn:hover{color:var(--text-primary)}
        .theme-switch-btn.active{