实现内容: - 新增多语言支持(中文/英文),包含完整翻译文件 - 适配 Windows 和 macOS 自定义标题栏,支持窗口控制与主题切换 - 新增侧边栏菜单,显示系统 CPU/内存占用与运行状态 - 配置 Tauri 窗口属性与权限,支持窗口拖拽、最大化等操作 - 新增 Pinia 状态管理,处理主题、语言与应用状态 - 新增系统统计数据获取与模拟逻辑,支持 Tauri 后端调用回退 - 新增路由配置,完成页面布局与视图组件初始化
50 lines
1.1 KiB
CSS
50 lines
1.1 KiB
CSS
@import 'tailwindcss';
|
||
|
||
/* 使用 class 方式控制暗色模式(配合 @vueuse/core 的 useDark) */
|
||
@custom-variant dark (&:where(.dark, .dark *));
|
||
|
||
html,
|
||
body,
|
||
#app {
|
||
height: 100%;
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
|
||
body {
|
||
overflow: hidden;
|
||
font-family: 'Inter', 'HarmonyOS Sans SC', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
|
||
-webkit-font-smoothing: antialiased;
|
||
}
|
||
|
||
/* 悬浮磨砂玻璃面板 */
|
||
.glass-panel {
|
||
border-radius: 16px;
|
||
border: 1px solid rgba(255, 255, 255, 0.55);
|
||
background: rgba(255, 255, 255, 0.55);
|
||
backdrop-filter: blur(18px) saturate(160%);
|
||
-webkit-backdrop-filter: blur(18px) saturate(160%);
|
||
box-shadow: 0 8px 32px rgba(15, 23, 42, 0.12);
|
||
}
|
||
|
||
.dark .glass-panel {
|
||
border-color: rgba(255, 255, 255, 0.08);
|
||
background: rgba(15, 23, 42, 0.55);
|
||
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
|
||
}
|
||
|
||
/* 细滚动条 */
|
||
::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
|
||
::-webkit-scrollbar-thumb {
|
||
border-radius: 9999px;
|
||
background: rgba(100, 116, 139, 0.35);
|
||
}
|
||
|
||
::-webkit-scrollbar-track {
|
||
background: transparent;
|
||
}
|