AskaEth
bc8b1ee6c0
- M3 认证/权限/审计/限流 + 全部 REST 接口 - M4 管理面板（MIUIx + 成绩录入/积分榜下钻/大屏控制） - M5a 大屏页面（六页 + 明细覆盖层 + 缩放适配） - M6 WebSocket 实时同步中心 - M7 xlsx 导出 + 赛事包 zip + 备份 - 规则包 YAML 导入导出（差异预览） - 字体 vendor 子集化（4 套 x2 字重） - 集成：realtime/export/rules 接入 main+httpapi；backup 子命令 - 修复：中间件包装 ResponseWriter 丢失 Hijacker，导致 WS 握手 501
199 lines
7.6 KiB
CSS
199 lines
7.6 KiB
CSS
/* ═══════════════════════════════════════════
|
|
MIUIX CONSOLE — Design Tokens
|
|
直接从 Miuix Colors.kt lightColorScheme() / darkColorScheme() 移植
|
|
═══════════════════════════════════════════ */
|
|
|
|
:root {
|
|
/* ── Primary — from Miuix lightColorScheme primary = Color(0xFF3482FF) ── */
|
|
--mx-primary: #3482FF;
|
|
--mx-primary-hover: #5D9BFF;
|
|
--mx-primary-active: #277AF7;
|
|
--mx-primary-on: #FFFFFF;
|
|
--mx-primary-glow: rgba(52,130,255,0.12);
|
|
--mx-primary-container: #5D9BFF;
|
|
--mx-primary-container-on: #FFFFFF;
|
|
--mx-primary-variant: #3482FF;
|
|
--mx-primary-variant-on: #AECDFF;
|
|
--mx-tertiary-container: #EAF2FF;
|
|
--mx-tertiary-container-on: #3482FF;
|
|
|
|
/* ── Error — from Miuix error = Color(0xFFE94634) ── */
|
|
--mx-error: #E94634;
|
|
--mx-error-on: #FFFFFF;
|
|
--mx-error-container: #FDF6F4;
|
|
--mx-error-container-on: #410002;
|
|
|
|
/* ── Semantic ── */
|
|
--mx-green: #34D399;
|
|
--mx-amber: #FBBF24;
|
|
--mx-blue: #60A5FA;
|
|
|
|
/* ── Surface — from Miuix lightColorScheme() 源码 ── */
|
|
--mx-bg: #FFFFFF; /* background = White */
|
|
--mx-surface: #F7F7F7; /* surface = 0xFFF7F7F7 */
|
|
--mx-surface-variant: #FFFFFF; /* surfaceVariant = White */
|
|
--mx-s1: #F7F7F7; /* surface */
|
|
--mx-s2: #FFFFFF; /* surfaceContainer = White */
|
|
--mx-s3: #E8E8E8; /* surfaceContainerHigh = 0xFFE8E8E8 */
|
|
--mx-s4: #E8E8E8; /* surfaceContainerHighest = 0xFFE8E8E8 */
|
|
--mx-s-hover: rgba(0,0,0,0.04);
|
|
--mx-s-active: rgba(0,0,0,0.07);
|
|
|
|
/* ── Text — from Miuix 源码 ── */
|
|
--mx-text: #000000; /* onSurface = Black */
|
|
--mx-text-on-surface: rgba(0,0,0,0.8); /* onSurfaceSecondary = 0xCC000000 */
|
|
--mx-text-variant: rgba(0,0,0,0.6); /* onSurfaceVariantSummary = 0x99000000 */
|
|
--mx-text-actions: rgba(0,0,0,0.4); /* onSurfaceVariantActions = 0x66000000 */
|
|
--mx-t2: rgba(0,0,0,0.6);
|
|
--mx-t3: rgba(0,0,0,0.4);
|
|
--mx-text-bg-variant: #8C93B0; /* onBackgroundVariant */
|
|
--mx-text-container-variant: #959595; /* onSurfaceContainerVariant */
|
|
--mx-text-container-high: #A2A2A2; /* onSurfaceContainerHigh */
|
|
--mx-text-disabled: #B2B2B2; /* disabledOnSurface */
|
|
|
|
/* ── Secondary — from Miuix 源码 ── */
|
|
--mx-secondary: #E6E6E6; /* secondary */
|
|
--mx-secondary-variant: #F0F0F0; /* secondaryVariant */
|
|
--mx-secondary-container: #F0F0F0;
|
|
--mx-secondary-container-on: #A9A9A9;
|
|
|
|
/* ── Border / Divider — from Miuix 源码 ── */
|
|
--mx-border: #D9D9D9; /* outline = 0xFFD9D9D9 */
|
|
--mx-divider: #E0E0E0; /* dividerLine = 0xFFE0E0E0 */
|
|
|
|
/* ── Disabled — from Miuix 源码 ── */
|
|
--mx-disabled-primary: #C2D9FF;
|
|
--mx-disabled-primary-on: #F3F8FF;
|
|
--mx-disabled-secondary: #F0F0F0;
|
|
--mx-disabled-secondary-on: #FCFCFC;
|
|
|
|
/* ── Window ── */
|
|
--mx-window-dim: rgba(0,0,0,0.3); /* windowDimming */
|
|
|
|
/* ── Slider — from Miuix 源码 ── */
|
|
--mx-slider-bg: rgba(0,0,0,0.06); /* 0x0F000000 */
|
|
--mx-slider-key: rgba(163,179,205,0.3);
|
|
--mx-slider-key-fg: #6EB5FF;
|
|
|
|
/* ── Radius (Miuix Smooth Corner — 16dp default) ── */
|
|
--mx-r: 16px;
|
|
--mx-r-sm: 12px;
|
|
--mx-r-xs: 8px;
|
|
--mx-r-pill: 9999px;
|
|
|
|
/* ── Shadow (Miuix multi-layer soft shadow) ── */
|
|
--mx-sh1: 0 1px 4px rgba(0,0,0,0.08);
|
|
--mx-sh2: 0 4px 16px rgba(0,0,0,0.06);
|
|
--mx-sh3: 0 8px 32px rgba(0,0,0,0.08);
|
|
--mx-glow: 0 0 0 1px rgba(52,130,255,0.06), 0 2px 12px rgba(52,130,255,0.04);
|
|
|
|
/* ── Motion (Miuix spring + ease) ── */
|
|
--mx-ease: cubic-bezier(0.16, 1, 0.3, 1);
|
|
--mx-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
--mx-d1: 100ms;
|
|
--mx-d2: 200ms;
|
|
--mx-d3: 320ms;
|
|
--mx-d4: 500ms;
|
|
|
|
/* ── Typography ── */
|
|
--mx-font: "MiSans", "Mi Sans", -apple-system, "PingFang SC", "Noto Sans SC", sans-serif;
|
|
--mx-mono: "JetBrains Mono", "SF Mono", monospace;
|
|
|
|
/* Typography scale */
|
|
--mx-text-xs: 11px;
|
|
--mx-text-sm: 12px;
|
|
--mx-text-base: 13px;
|
|
--mx-text-md: 14px;
|
|
--mx-text-lg: 15px;
|
|
--mx-text-xl: 16px;
|
|
--mx-text-2xl: 20px;
|
|
--mx-text-3xl: 24px;
|
|
|
|
/* ── Safe area ── */
|
|
--mx-safe-t: env(safe-area-inset-top, 0px);
|
|
--mx-safe-b: env(safe-area-inset-bottom, 0px);
|
|
}
|
|
|
|
/* ═══════════════════════════════════════════
|
|
DARK MODE — from Miuix darkColorScheme() 源码
|
|
═══════════════════════════════════════════ */
|
|
[data-theme="dark"] {
|
|
/* Primary — darkColorScheme primary = Color(0xFF277AF7) */
|
|
--mx-primary: #277AF7;
|
|
--mx-primary-hover: #338FE4;
|
|
--mx-primary-active: #0073DD;
|
|
--mx-primary-on: #FFFFFF;
|
|
--mx-primary-glow: rgba(39,122,247,0.15);
|
|
--mx-primary-container: #338FE4;
|
|
--mx-primary-container-on: #FFFFFF;
|
|
--mx-primary-variant: #0073DD;
|
|
--mx-primary-variant-on: #99C7F1;
|
|
--mx-tertiary-container: #2B3B54;
|
|
--mx-tertiary-container-on: #4788FF;
|
|
|
|
/* Error — darkColorScheme error = Color(0xFFF12522) */
|
|
--mx-error: #F12522;
|
|
--mx-error-on: #FFFFFF;
|
|
--mx-error-container: #2E0603;
|
|
--mx-error-container-on: #FFDAD6;
|
|
|
|
/* Surface — 5-level gradient with 3-5% brightness steps */
|
|
--mx-bg: #161616; /* 页面背景 — 最底层 */
|
|
--mx-surface: #0C0C0C; /* surface = s1 */
|
|
--mx-surface-variant: #1C1C1C; /* surfaceVariant = s2 */
|
|
--mx-s1: #0C0C0C; /* 导航栏、侧边栏 — 比 bg 深 */
|
|
--mx-s2: #1C1C1C; /* 卡片 — 比 bg 浅 */
|
|
--mx-s3: #242424; /* 输入框、浮层 — 比 s2 浅 */
|
|
--mx-s4: #2C2C2C; /* 下拉菜单 — 最亮 */
|
|
--mx-s-hover: rgba(255,255,255,0.04);
|
|
--mx-s-active: rgba(255,255,255,0.07);
|
|
|
|
/* Text — from Miuix darkColorScheme() 源码 */
|
|
--mx-text: #F2F2F2; /* onSurface = 0xFFF2F2F2 */
|
|
--mx-text-on-surface: rgba(255,255,255,0.8); /* 0xCCFFFFFF */
|
|
--mx-text-variant: rgba(255,255,255,0.5); /* 0x80FFFFFF */
|
|
--mx-text-actions: rgba(255,255,255,0.4); /* 0x66FFFFFF */
|
|
--mx-t2: rgba(255,255,255,0.6);
|
|
--mx-t3: rgba(255,255,255,0.4);
|
|
--mx-text-bg-variant: #787E96;
|
|
--mx-text-container-variant: #737373;
|
|
--mx-text-container-high: #666666;
|
|
--mx-text-disabled: #666666;
|
|
|
|
/* Secondary — from Miuix darkColorScheme() 源码 */
|
|
--mx-secondary: #505050;
|
|
--mx-secondary-variant: #434343;
|
|
--mx-secondary-container: #434343;
|
|
--mx-secondary-container-on: #7C7C7C;
|
|
|
|
/* Border / Divider — 提升对比度 */
|
|
--mx-border: #484848; /* outline = 提升到可见 */
|
|
--mx-divider: #404040; /* dividerLine = 提升到可见 */
|
|
|
|
/* Disabled */
|
|
--mx-disabled-primary: #253E64;
|
|
--mx-disabled-primary-on: #677993;
|
|
--mx-disabled-secondary: #3F3F3F;
|
|
--mx-disabled-secondary-on: #797979;
|
|
|
|
/* Window */
|
|
--mx-window-dim: rgba(0,0,0,0.6);
|
|
|
|
/* Slider */
|
|
--mx-slider-bg: rgba(255,255,255,0.15);
|
|
--mx-slider-key: rgba(122,138,166,0.3);
|
|
--mx-slider-key-fg: #5DAAFF;
|
|
|
|
/* Shadow — dark mode 阴影更重 */
|
|
--mx-sh1: 0 1px 4px rgba(0,0,0,0.5);
|
|
--mx-sh2: 0 4px 16px rgba(0,0,0,0.4);
|
|
--mx-sh3: 0 8px 32px rgba(0,0,0,0.45);
|
|
--mx-glow: 0 0 0 1px rgba(39,122,247,0.08), 0 2px 12px rgba(39,122,247,0.06);
|
|
}
|
|
|
|
/* ═══ COMPACT DENSITY ═══ */
|
|
[data-density="compact"] {
|
|
--mx-r: 14px;
|
|
--mx-r-sm: 10px;
|
|
}
|