mirrors2/auv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: 管理面板主题切换与主站一致（SVG图标+紧凑布局）

Browse Source
This commit is contained in:
Sakurasan
2026-09-01 19:18:27 +08:00
parent 317ea483d0
commit bdeda21386
1 changed files with 14 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
backend/dist/admin.html
Vendored
+14 -8
View File
@@ -129,10 +129,10 @@ tr:hover td{background:color-mix(in oklch,var(--accent) 40%,transparent)}
.modal-box h3{font-size:16px;font-weight:600;margin-bottom:16px}
/* Theme toggle */
.theme-toggle{position:fixed;bottom:16px;right:16px;z-index:50;display:flex;gap:4px;padding:4px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 2px 8px oklch(0 0 0 / .08)}
.theme-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;border-radius:calc(var(--radius) - 2px);cursor:pointer;background:transparent;color:var(--muted-foreground);font-size:16px;transition:all .15s}
.theme-btn:hover{background:var(--accent);color:var(--accent-foreground)}
.theme-btn.active{background:var(--primary);color:var(--primary-foreground)}
.theme-toggle{position:fixed;bottom:16px;right:16px;z-index:50;display:flex;padding:3px;background:var(--muted);border-radius:var(--radius);box-shadow:0 2px 8px oklch(0 0 0 / .08);gap:3px}
.theme-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;border-radius:calc(var(--radius) - 2px);cursor:pointer;background:transparent;color:var(--muted-foreground);font-size:16px;transition:all .15s;padding:0}
.theme-btn:hover{color:var(--foreground)}
.theme-btn.active{background:var(--background);color:var(--foreground);box-shadow:0 1px 3px oklch(0 0 0 / .08)}
</style>
</head>
<body>
@@ -201,10 +201,16 @@ tr:hover td{background:color-mix(in oklch,var(--accent) 40%,transparent)}
</div>
<!-- Theme Toggle -->
<div class="theme-toggle">
<button class="theme-btn" onclick="setTheme('light')" id="themeLight">☀️</button>
<button class="theme-btn" onclick="setTheme('dark')" id="themeDark">🌙</button>
<button class="theme-btn" onclick="setTheme('system')" id="themeSystem">💻</button>
<div class="theme-toggle" id="themeToggle">
<button class="theme-btn active" onclick="setTheme('light')" id="themeLight" title="浅色">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="4"/><path d="M12 2v2"/><path d="M12 20v2"/><path d="m4.93 4.93 1.41 1.41"/><path d="m17.66 17.66 1.41 1.41"/><path d="M2 12h2"/><path d="M20 12h2"/><path d="m6.34 17.66-1.41 1.41"/><path d="m19.07 4.93-1.41 1.41"/></svg>
</button>
<button class="theme-btn" onclick="setTheme('dark')" id="themeDark" title="深色">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"/></svg>
</button>
<button class="theme-btn" onclick="setTheme('system')" id="themeSystem" title="自动">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="3" width="20" height="14" rx="2"/><path d="M8 21h8"/><path d="M12 17v4"/></svg>
</button>
</div>
<script>