/** * 终端金融数据系统 - 公共主题变量 (Terminal Design System) * 专为高密度、长时间注视的深色环境设计 * * 使用方法：在每个 HTML 的 最顶部引入 * * * 修改主题色：只需改这一个文件，全部12个页面自动生效 * 版本号规则：每次修改 theme.css 后更新 ?v=YYYYMMDD 参数 */ :root { /* ================= 1. 背景色系统 (深色低对比) ================= */ --bg-app: #0E1015; /* 软件底层级背景 */ --bg-panel: #15181E; /* 面板/卡片背景 */ --bg-hover: #21262E; /* 列表悬停/选中背景 */ --bg-border: #2B303B; /* 分割线/边框颜色 */ /* ================= 2. 文字色系统 ================= */ --text-primary: #DDE2E8; /* 核心文字：名称、重要数据 (非纯白，防眩光) */ --text-secondary: #8A939E; /* 辅助文字：表头、非核心维度 */ --text-muted: #4A5361; /* 极弱文字：时间、无关紧要的描述 */ /* ================= 3. A股信号色系统 (核心) ================= */ --up-color: #E6413A; /* 涨幅红 (哑光，去刺眼) */ --up-bg: rgba(230, 65, 58, 0.15); /* 涨幅高亮底色 */ --down-color: #28A745; /* 跌幅绿 (沉稳) */ --down-bg: rgba(40, 167, 69, 0.15); --limit-up-color: #FF5E56; /* 涨停极值红 (略亮于普通红) */ --broken-color: #D9A400; /* 炸板/警示暗金 */ --broken-bg: rgba(217, 164, 0, 0.15); /* ================= 4. 交互色 (禁止用红绿) ================= */ --accent: #3685DF; /* 选中/聚焦状态蓝 */ --accent-hover: #4B9BEE; --accent-bg: rgba(54, 133, 223, 0.15); } /* ================= 全局基准样式 ================= */ *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; } body, html { background-color: var(--bg-app); color: var(--text-primary); font-family: "Microsoft YaHei", "PingFang SC", sans-serif; font-size: 12px; line-height: 1.4; overflow: hidden; user-select: none; } /* 核心：解决数字跳动时的排版抖动（等宽数字字体） */ .num, .price, .percent, .tabular-nums, td[data-type="number"] { font-family: Arial, Consolas, sans-serif; font-variant-numeric: tabular-nums; font-weight: 700; } /* 信号色通用类 */ .is-up { color: var(--up-color) !important; } .is-down { color: var(--down-color) !important; } .is-limit-up { color: var(--limit-up-color) !important; background-color: var(--up-bg); padding: 1px 4px; border-radius: 2px; } .is-broken { color: var(--broken-color) !important; } .is-muted { color: var(--text-muted) !important; } /* 极简滚动条 (适应暗黑终端) */ ::-webkit-scrollbar { width: 4px; height: 4px; } ::-webkit-scrollbar-track { background: var(--bg-app); } ::-webkit-scrollbar-thumb { background: var(--text-muted); border-radius: 3px; } ::-webkit-scrollbar-thumb:hover { background: var(--text-secondary); }