AskaEth
b37cbf076c
- Rewrite CSS with full MD3 color tokens + elevation + shape system - Add light theme with data-theme="light" - Theme toggle button in top bar (persists to localStorage) - 268 lines CSS, covers login/shell/dashboard/plugins/projects/proxy
68 lines
3.1 KiB
HTML
68 lines
3.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>SenSu 面板</title>
|
|
<!-- 🟢 加上 static 前缀 -->
|
|
<link rel="stylesheet" href="./static/css/style.css">
|
|
</head>
|
|
<body>
|
|
<div id="app" class="app-frame">
|
|
<header class="top-bar">
|
|
<div class="title">🐱 SenSu Alpha <span id="ver-badge" style="font-size:0.7em; opacity:0.5; margin-left:4px;"></span></div>
|
|
<div class="user-info">
|
|
<span id="uname">Loading...</span>
|
|
<button class="theme-toggle" onclick="toggleTheme()" title="切换日夜间模式">🌓</button>
|
|
<button class="logout-btn" onclick="doLogout()">退出</button>
|
|
</div>
|
|
</header>
|
|
|
|
<aside class="sidebar">
|
|
<a class="nav-item active" data-page="dashboard">
|
|
<svg viewBox="0 0 24 24"><path d="M3 13h8V3H3v10zm0 8h8v-6H3v6zm10 0h8V11h-8v10zm0-18v6h8V3h-8z"/></svg>
|
|
<span>仪表盘</span>
|
|
</a>
|
|
<a class="nav-item" data-page="logs">
|
|
<svg viewBox="0 0 24 24"><path d="M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zm2 16H8v-2h8v2zm0-4H8v-2h8v2zm-3-5V3.5L18.5 9H13z"/></svg>
|
|
<span>实时日志</span>
|
|
</a>
|
|
<a class="nav-item" data-page="console">
|
|
<svg viewBox="0 0 24 24"><path d="M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-8 14H4v-4h8v4zm0-6H4V8h8v4zm8 6h-8v-4h8v4zm0-6h-8V8h8v4z"/></svg>
|
|
<span>控制台</span>
|
|
</a>
|
|
<a class="nav-item" data-page="plugins">
|
|
<svg viewBox="0 0 24 24"><path d="M20.5 11H19V7c0-1.1-.9-2-2-2h-4V3.5C13 2.12 11.88 1 10.5 1S8 2.12 8 3.5V5H4c-1.1 0-1.99.9-1.99 2v3.8H3.5c1.49 0 2.7 1.21 2.7 2.7s-1.21 2.7-2.7 2.7H2V20c0 1.1.9 2 2 2h3.8v-1.5c0-1.49 1.21-2.7 2.7-2.7 1.49 0 2.7 1.21 2.7 2.7V22H17c1.1 0 2-.9 2-2v-4h1.5c1.38 0 2.5-1.12 2.5-2.5S21.88 11 20.5 11z"/></svg>
|
|
<span>插件管理</span>
|
|
</a>
|
|
<div class="toggle-sidebar" onclick="toggleSidebar()">☰</div>
|
|
</aside>
|
|
|
|
<main class="content-area">
|
|
<div id="progress" class="progress-bar"></div>
|
|
<div id="page-content" class="page-container"></div>
|
|
</main>
|
|
</div>
|
|
|
|
<!-- 🟢 1. 先加载图表库 -->
|
|
<script src="./static/js/chart.js"></script>
|
|
|
|
<!-- 🟢 2. 再加载主逻辑 -->
|
|
<script src="./static/js/app.js"></script>
|
|
</body>
|
|
</html>
|
|
|
|
<script>
|
|
function toggleTheme(){
|
|
var t=document.documentElement.getAttribute("data-theme")==="light"?"dark":"light";
|
|
document.documentElement.setAttribute("data-theme",t);
|
|
localStorage.setItem("sensu-theme",t);
|
|
document.querySelector(".theme-toggle").textContent=t==="light"?"☀️":"🌙";
|
|
}
|
|
(function(){
|
|
var s=localStorage.getItem("sensu-theme")||"dark";
|
|
document.documentElement.setAttribute("data-theme",s);
|
|
var btn=document.querySelector(".theme-toggle");
|
|
if(btn) btn.textContent=s==="light"?"☀️":"🌙";
|
|
})();
|
|
</script>
|