fix: 组件配色全面对齐 Ant Design 5 token + 修复 iframe 内页签初始激活(issue #131)
组件审查结论:全站组件为自绘 HTML+CSS 仿 AntD(纯静态无组件库), pro.css 已统一设计 token,但各页 CSS/JS 残留一批旧配色硬编码, pro.css 覆盖不到,本次全部清理: - 旧 iOS 红 #ff3b30 → --ant-error #ff4d4f(告警 P0/严重度/DLP 条/ 工艺 alarm 态/diff 删除行) - 旧橙 #f5a623 → --ant-warning #faad14(P1 告警/warning 态/暂存徽章) - 旧 iOS 绿 #2ecc71 → --ant-success #52c41a(running 态/prod 徽章/ 索引完成/路由本地标签/权限矩阵) - 杂色蓝统一 → --ant-primary #1677ff:发送键 #0ea5e9、P2 告警 #3aa0ff、编排画布残留青 rgba(24,211,200)、旧气泡 #1d4ed8 - 主色按钮上的深色文字 #04202a → #fff(对比度修正) - 灰 #64748b → --ant-text-tertiary rgba(0,0,0,0.45) - 各页 CSS :root 深色默认变量值(#0b1220/#13203a/#18d3c8 等死值) 对齐为 AntD 亮色默认值,修正"深色主题"过时注释 - 删除已无任何引用的旧深色登录页样式 auth/auth.css 顺带修复实测发现的 bug:SPA 外壳内直达 admin/studio 子页时页签 不切换——studio.js/admin.js 的 Tab 事件在异步 boot(user) 中绑定, bindPageTabs 的 window load 初始激活可能早于绑定完成,改为带重试 的激活(直到 Tab 点亮,最多 10s)。实测 #/admin/#alerts 直达后 page-alerts 正确激活。
This commit is contained in:
+18
-16
@@ -1,7 +1,9 @@
|
||||
/* iAOP 对话助手增强版样式(issue #133)。深色主题,与 chat_widget.html / cockpit 一致。 */
|
||||
/* iAOP 对话助手增强版样式(issue #133)。Ant Design 5 token 调色(2026-08 全站 AntD Pro 重构)。 */
|
||||
:root {
|
||||
--bg: #0f172a; --surface: #111c33; --surface-2: #1e293b;
|
||||
--fg: #e2e8f0; --fg-muted: #94a3b8; --accent: #38bdf8; --warn: #f5a623;
|
||||
/* 默认值 = Ant Design 5 亮色 token(pro.css 在后加载再次确认) */
|
||||
--bg: #f0f2f5; --surface: #ffffff; --surface-2: rgba(0,0,0,0.04);
|
||||
--fg: rgba(0,0,0,0.88); --fg-muted: rgba(0,0,0,0.45);
|
||||
--accent: #1677ff; --warn: #faad14;
|
||||
}
|
||||
* { box-sizing: border-box; }
|
||||
body { margin: 0; font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
|
||||
@@ -11,10 +13,10 @@ body { margin: 0; font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
|
||||
#topbar { display: flex; align-items: center; justify-content: space-between; }
|
||||
h1 { font-size: 18px; color: var(--accent); margin: 0; }
|
||||
h1 .sub { font-size: 12px; color: var(--fg-muted); font-weight: 400; }
|
||||
.hint { font-size: 11px; color: #64748b; }
|
||||
.hint { font-size: 11px; color: rgba(0,0,0,0.45); }
|
||||
.dot { font-size: 13px; }
|
||||
.dot.ok { color: #2ecc71; }
|
||||
.dot.down { color: #ff3b30; }
|
||||
.dot.ok { color: #52c41a; }
|
||||
.dot.down { color: #ff4d4f; }
|
||||
|
||||
#messages { height: 480px; overflow-y: auto; border: 1px solid var(--surface-2);
|
||||
border-radius: 8px; padding: 12px; background: var(--surface); margin-top: 10px; }
|
||||
@@ -22,17 +24,17 @@ h1 .sub { font-size: 12px; color: var(--fg-muted); font-weight: 400; }
|
||||
.msg .who { font-size: 12px; color: var(--fg-muted); }
|
||||
.msg .text { display: inline-block; max-width: 88%; padding: 8px 12px; border-radius: 8px;
|
||||
white-space: pre-wrap; font-size: 14px; line-height: 1.6; }
|
||||
.user .text { background: #1d4ed8; }
|
||||
.user .text { background: #1677ff; }
|
||||
.bot .text { background: var(--surface-2); }
|
||||
.meta { font-size: 11px; color: #64748b; margin-top: 3px; display: flex; gap: 8px;
|
||||
.meta { font-size: 11px; color: rgba(0,0,0,0.45); margin-top: 3px; display: flex; gap: 8px;
|
||||
flex-wrap: wrap; align-items: center; }
|
||||
|
||||
/* 路由分级标签(本地/云端/拦截) */
|
||||
.route-tag { padding: 1px 8px; border-radius: 10px; font-size: 11px; }
|
||||
.route-local { background: rgba(46,204,113,.15); color: #2ecc71; }
|
||||
.route-local { background: rgba(82,196,26,.15); color: #52c41a; }
|
||||
.route-cloud { background: rgba(56,189,248,.15); color: var(--accent); }
|
||||
.route-block { background: rgba(255,59,48,.15); color: #ff3b30; }
|
||||
.human-tag { background: rgba(245,166,35,.15); color: var(--warn);
|
||||
.route-block { background: rgba(255,77,79,.15); color: #ff4d4f; }
|
||||
.human-tag { background: rgba(250,173,20,.15); color: var(--warn);
|
||||
padding: 1px 8px; border-radius: 10px; font-size: 11px; }
|
||||
|
||||
/* RAG 引用溯源(PRD 5.4 强制) */
|
||||
@@ -40,7 +42,7 @@ h1 .sub { font-size: 12px; color: var(--fg-muted); font-weight: 400; }
|
||||
padding: 4px 10px; background: rgba(56,189,248,.06); border-radius: 0 6px 6px 0; }
|
||||
.citations .cite-title { color: var(--accent); font-size: 11px; margin-bottom: 2px; }
|
||||
.citations .cite-item { color: var(--fg-muted); margin: 2px 0; }
|
||||
.no-citation { margin-top: 6px; font-size: 11px; color: #64748b; }
|
||||
.no-citation { margin-top: 6px; font-size: 11px; color: rgba(0,0,0,0.45); }
|
||||
|
||||
/* 场景输入区 */
|
||||
.scenario-inputs { display: flex; gap: 8px; margin-top: 10px; align-items: center; }
|
||||
@@ -48,16 +50,16 @@ h1 .sub { font-size: 12px; color: var(--fg-muted); font-weight: 400; }
|
||||
|
||||
/* DLP 拦截反馈条 */
|
||||
#dlp-banner { margin-top: 10px; padding: 10px 12px; border-radius: 8px; font-size: 13px;
|
||||
background: rgba(255,59,48,.10); border: 1px solid #ff3b30; color: #ffb4ad; }
|
||||
background: rgba(255,77,79,.10); border: 1px solid #ff4d4f; color: #cf1322; }
|
||||
#dlp-banner button { margin-left: 8px; padding: 4px 10px; font-size: 12px; border: none;
|
||||
border-radius: 5px; cursor: pointer; background: var(--surface-2);
|
||||
color: var(--fg); }
|
||||
|
||||
#panel { margin-top: 10px; display: flex; gap: 8px; }
|
||||
select, input { padding: 8px; border-radius: 6px; border: 1px solid #334155;
|
||||
background: #0b1526; color: var(--fg); }
|
||||
select, input { padding: 8px; border-radius: 6px; border: 1px solid #d9d9d9;
|
||||
background: #ffffff; color: var(--fg); }
|
||||
input { flex: 1; }
|
||||
button#send { padding: 8px 16px; border: none; border-radius: 6px; background: #0ea5e9;
|
||||
button#send { padding: 8px 16px; border: none; border-radius: 6px; background: #1677ff;
|
||||
color: #fff; cursor: pointer; }
|
||||
button#send:disabled { opacity: .5; }
|
||||
#footer-hint { margin-top: 8px; }
|
||||
|
||||
Reference in New Issue
Block a user