style(dashboard): 收窄并统一仪表板模块间垂直间距至 12px#254
Merged
Merged
Conversation
- 新增 CSS 变量 --gap-section: 12px 作为模块间距单一事实源 - 将 .time-range-bar / .kpi-grid / .model-calling-card / .charts-grid / .charts-grid-2 / .model-token-card 的 margin-bottom 统一指向该变量 - 消除底部 Token 用量卡片的 inline style,改用语义化 class 🤖 Generated with [Claude Code](https://github.com/claude), [CodeX](https://openai.com), [Gemini](https://github.com/apps/gemini-code-assist) Co-Authored-By: Aurelius Huang<threefish.ai@gmail.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
概要
将仪表板各功能模块之间的垂直间距统一收窄至 12px,并以单一 CSS 变量
--gap-section作为权威间距源(Single Source of Truth),消除散落在样式与行内属性中的魔法数字,提升后续维度调优的可维护性与视觉一致性。背景与动机
仪表板此前模块间距值散乱(24px / 16px / 12px / 5px 并存),既造成视觉上「松紧不一」的割裂感,也增加了未来微调时的修改面与回归风险。本次将「模块间」(inter-module) 间距收敛为单一变量,使整页节奏一致、改动可一处生效。
变更内容
:root中引入--gap-section: 12px,作为模块间垂直间距的唯一权威源。var(--gap-section)替换以下选择器中的margin-bottom:.kpi-grid(24px → 12px).charts-grid/.charts-grid-2(16px → 12px).time-range-bar(24px → 12px).model-calling-card(5px → 12px).model-token-cardclass,替换Token 用量卡片上的style=\"margin-bottom:12px\"行内属性,与同级模块对齐管理方式。实现说明
.card-title、.detail-identity-row、#chart-tooltip-title等「组件内部」(intra-component) 的 margin,避免越界改动影响卡片自身排版。src/coding/proxy/server/dashboard.py单文件,+10 / -6。🤖 Generated with Claude Code
Co-Authored-By: Aurelius Huangthreefish.ai@gmail.com