diff --git a/assets/screenshots/README.md b/assets/screenshots/README.md index c5aadb7b04..b6179b40de 100644 --- a/assets/screenshots/README.md +++ b/assets/screenshots/README.md @@ -1,9 +1,12 @@ # Screenshots -> Console 与 Management 的设计/回归参考截图。视口统一 1496×933 桌面端。 +> Console 与 Management UI 2.0 的本地运行截图。视口统一 1496×933 桌面端。 > > 主题:项目使用 `packages/theme` 维护 light/dark/system 三态。下表「主题」列 > 表示截图实际渲染的主题。 +> +> 本组截图沿用本地外观配置:Orange / Stone、Serif 字体、None 圆角、Compact 密度、 +> Solid 菜单和 Standard 图表配色。页面内容来自现有本地数据;空状态保留实际结果。 ## Console · 用户端 (9002) @@ -12,14 +15,14 @@ | `forum-list-light.png` | 论坛首页 | Light | `/forum` | 浅色主题下的论坛列表 / 板块 / 热门话题 | | `forum-thread-dark.png` | 论坛首页 | Dark | `/forum` | 深色主题下的论坛列表 | | `forum-detail-dark.png` | 帖子详情 | Dark | `/forum/detailed/fpost-009` | 帖子正文 / 评论 / Markdown 渲染 | -| `contests-dark.png` | 比赛页 | Dark | `/contest` | 个人 / 团队 / 公开 / 虚拟赛入口 | -| `contest-detail-dark.png` | 比赛详情 | Dark | `/contest/linked-list-special` | 比赛题目 tab(含倒计时、注册状态) | +| `contests-dark.png` | 比赛页 | Dark | `/contest` | 进行中 / 即将开始 / 历史比赛、排行榜与虚拟赛入口 | +| `contest-detail-dark.png` | 比赛详情 | Dark | `/contest/linked-list-special` | 已结束比赛概览、规则与虚拟赛入口 | | `problem-set-dark.png` | 题库专题 | Dark | `/problemset` | 题单聚合 / 推荐专题 | | `problem-list-dark.png` | 题单详情 | Dark | `/problemset/list/list-essentials` | 单个题单的题目列表结构 | -| `problem-detail-dark.png` | 题目详情 | Dark | `/problems/two-sum` | Markdown 题面 + 示例 + 提交入口 | -| `personal-dashboard-dark.png` | 个人 Dashboard | Dark | `/personal/dashboard` | 解题进度 / Rating / 成就总览 | +| `problem-detail-dark.png` | 题目详情 | Dark | `/problems/two-sum/description` | Markdown 题面、代码编辑器、测试用例与提交入口 | +| `personal-dashboard-dark.png` | 个人 Dashboard | Dark | `/personal/dashboard` | 解题进度、活跃热力图与技能雷达 | | `submissions-list-dark.png` | 提交记录 | Dark | `/personal/submissions` | 个人判题历史 / Verdict 分布 | -| `achievements-dark.png` | 成就页 | Dark | `/personal/achievements` | 徽章墙 / 解题连击 / 排行榜 | +| `achievements-dark.png` | 成就页 | Dark | `/personal/achievements` | 成就概览、分类与当前账号的空状态 | ## Management · 管理端 (9003) @@ -29,8 +32,8 @@ | `analytics-dashboard-dark.png` | 数据分析 | Dark | `/analytics` | 多维图表(注册 / 提交 / 判题) | | `user-management-dark.png` | 用户管理 | Dark | `/users` | 用户列表 / 角色 / 封禁 / 审计 | | `contest-management-dark.png` | 比赛管理 | Dark | `/contests` | 比赛 CRUD / 状态切换 | -| `moderation-dark.png` | 审核管理 | Dark | `/moderation/dashboard` | 举报队列 / 申诉 / 敏感词 | -| `submissions-audit-dark.png` | 提交审计 | Dark | `/submissions` | 全平台提交流 / Replay / 再判 | +| `moderation-dark.png` | 审核统计 | Dark | `/moderation/dashboard` | 举报分类、处理状态与申诉入口 | +| `submissions-audit-dark.png` | 提交审计 | Dark | `/submissions` | 全平台提交列表、状态、详情与再判入口 | ## 重新生成 @@ -38,13 +41,16 @@ # 1. 在已满足 Submission cutover gate 的环境启动完整 dev stack ./scripts/dev/up.sh --mode dev-full --skip-install -# 2. 用 IDE 内置浏览器打开对应 URL -# 3. 在 console 中切换主题 (右上角用户菜单 → 主题 → 浅色/深色) -# 4. 截图覆盖 assets/screenshots/.png +# 2. 如服务已运行,直接复用;用内置浏览器和现有会话打开对应 URL +# 3. 用户菜单 → Appearance → Color mode,按表格选择 Light / Dark 并 Apply +# 4. 等待页面数据、字体与图表加载完成,以原始 PNG 覆盖 assets/screenshots/.png +# 5. 完成后恢复原来的外观偏好与浏览器视口 ``` -> 浏览器内部截图工具:调用 `Page.captureScreenshot`(CDP), -> base64 解码后写回 `assets/screenshots/.png`。 +> 浏览器内部截图工具:视口设为 1496×933,调用 `Page.captureScreenshot`(CDP), +> 使用 PNG、`captureBeyondViewport: true` 与 `clip: { x: 0, y: 0, width: 1496, height: 933, scale: 1 }`, +> base64 解码后直接写回 `assets/screenshots/.png`;不要保存工具自动缩放的预览图。 +> 核对 PNG 可解码、像素尺寸、页面、主题以及是否仍有加载遮罩,再检查索引与 README 图片引用。 ## 命名约定 diff --git a/assets/screenshots/achievements-dark.png b/assets/screenshots/achievements-dark.png index 30c351874a..5a8315d918 100644 Binary files a/assets/screenshots/achievements-dark.png and b/assets/screenshots/achievements-dark.png differ diff --git a/assets/screenshots/admin-dashboard-dark.png b/assets/screenshots/admin-dashboard-dark.png index a18cac25f3..2e3da8a757 100644 Binary files a/assets/screenshots/admin-dashboard-dark.png and b/assets/screenshots/admin-dashboard-dark.png differ diff --git a/assets/screenshots/analytics-dashboard-dark.png b/assets/screenshots/analytics-dashboard-dark.png index ad92686197..7de402675f 100644 Binary files a/assets/screenshots/analytics-dashboard-dark.png and b/assets/screenshots/analytics-dashboard-dark.png differ diff --git a/assets/screenshots/contest-detail-dark.png b/assets/screenshots/contest-detail-dark.png index c7beaddaea..17ef989ce1 100644 Binary files a/assets/screenshots/contest-detail-dark.png and b/assets/screenshots/contest-detail-dark.png differ diff --git a/assets/screenshots/contest-management-dark.png b/assets/screenshots/contest-management-dark.png index 41a9f92143..31c7761bc5 100644 Binary files a/assets/screenshots/contest-management-dark.png and b/assets/screenshots/contest-management-dark.png differ diff --git a/assets/screenshots/contests-dark.png b/assets/screenshots/contests-dark.png index 901cc0d3c3..c46c38a25d 100644 Binary files a/assets/screenshots/contests-dark.png and b/assets/screenshots/contests-dark.png differ diff --git a/assets/screenshots/forum-detail-dark.png b/assets/screenshots/forum-detail-dark.png index 9daa9b3734..35c35f2bbf 100644 Binary files a/assets/screenshots/forum-detail-dark.png and b/assets/screenshots/forum-detail-dark.png differ diff --git a/assets/screenshots/forum-list-light.png b/assets/screenshots/forum-list-light.png index c25c8ca119..90fd5726a2 100644 Binary files a/assets/screenshots/forum-list-light.png and b/assets/screenshots/forum-list-light.png differ diff --git a/assets/screenshots/forum-thread-dark.png b/assets/screenshots/forum-thread-dark.png index ab5c54e368..af2594be93 100644 Binary files a/assets/screenshots/forum-thread-dark.png and b/assets/screenshots/forum-thread-dark.png differ diff --git a/assets/screenshots/moderation-dark.png b/assets/screenshots/moderation-dark.png index 39facc6c3f..130a811294 100644 Binary files a/assets/screenshots/moderation-dark.png and b/assets/screenshots/moderation-dark.png differ diff --git a/assets/screenshots/personal-dashboard-dark.png b/assets/screenshots/personal-dashboard-dark.png index 0a77e71e33..3abf5acd76 100644 Binary files a/assets/screenshots/personal-dashboard-dark.png and b/assets/screenshots/personal-dashboard-dark.png differ diff --git a/assets/screenshots/problem-detail-dark.png b/assets/screenshots/problem-detail-dark.png index 52e4f8b39f..c8ad79c2be 100644 Binary files a/assets/screenshots/problem-detail-dark.png and b/assets/screenshots/problem-detail-dark.png differ diff --git a/assets/screenshots/problem-list-dark.png b/assets/screenshots/problem-list-dark.png index 19db9588ea..6287bc8f02 100644 Binary files a/assets/screenshots/problem-list-dark.png and b/assets/screenshots/problem-list-dark.png differ diff --git a/assets/screenshots/problem-set-dark.png b/assets/screenshots/problem-set-dark.png index 66ff4ab82d..8241bb4705 100644 Binary files a/assets/screenshots/problem-set-dark.png and b/assets/screenshots/problem-set-dark.png differ diff --git a/assets/screenshots/submissions-audit-dark.png b/assets/screenshots/submissions-audit-dark.png index c480a1218e..56e088acdb 100644 Binary files a/assets/screenshots/submissions-audit-dark.png and b/assets/screenshots/submissions-audit-dark.png differ diff --git a/assets/screenshots/submissions-list-dark.png b/assets/screenshots/submissions-list-dark.png index 087a21d2a6..12e8616a9f 100644 Binary files a/assets/screenshots/submissions-list-dark.png and b/assets/screenshots/submissions-list-dark.png differ diff --git a/assets/screenshots/user-management-dark.png b/assets/screenshots/user-management-dark.png index 0a7376cfa4..b1fb488083 100644 Binary files a/assets/screenshots/user-management-dark.png and b/assets/screenshots/user-management-dark.png differ