refactor: 重构站点导航与首页信息架构

[Qiyuanqiii]

背景

站点原顶部导航将首页、新生、学习、竞赛、学院、课程、资料、党建、办事、校园、贡献、FAQ、赞助等约 14 个入口平铺展示，逐渐出现以下问题：

• 桌面端导航项过多，页面宽度不足时容易拥挤或换行；
• 移动端需要在较长菜单中逐项查找，缺少稳定的上层分类；
• 首页原有“按场景找入口”和内容卡片存在重复，仍要求用户先理解站点内部栏目结构；
• 后续增加的开发、科研、升学就业等栏目没有进入原顶部导航；
• 首页和顶部导航分别维护，分类、文案和链接容易逐渐不一致。

本 PR 将导航从“按原栏目平铺”调整为“按学生任务分组”，在不迁移内容、不修改现有 URL 的前提下，减少一级入口并增强首页总览能力。

信息架构

所有现有顶级栏目归入以下六类：

新分类	子栏目与入口
新生指南	新生总览、报到与迎新、学杂费缴费、学生资助、新生问答
学业与课程	专业学习、培养方案与选课、课程资料
成长与实践	学科竞赛、开发与工具、科研与项目、升学与就业
校园与办事	校园生活、办事指南、党团事务
学院信息	学院概况与组织、教师专栏
关于本站	项目介绍、可信度与内容边界、参与贡献、帮助与纠错、赞助鸣谢

命名与入口说明：

• “首页”不再占用一个文字导航项，仍可通过左上角站点 Logo 返回；
• 原“党建专题”在导航中以“党团事务”呈现，但继续使用 /party/；
• 原“老师专栏”调整为更正式且符合现有内容的“教师专栏”；
• 原顶部导航未展示的开发、科研、升学就业栏目也纳入新的分类体系。

实现内容

1. 统一分类数据源

新增 docs/.vitepress/site-map.ts，集中维护：

• 六个一级分类的名称、说明与显示顺序；
• 每组对应的路由匹配规则；
• 分类主入口；
• 子栏目名称与链接。

顶部导航和首页分类卡片共用同一份数据，后续新增或调整栏目时无需维护两套配置。

2. 重构顶部导航

• 将原 14 个平铺入口收敛为 6 个下拉分组；
• 使用 activeMatch 覆盖每组下属的全部现有路由；
• 修正分组激活态样式；
• 修复两行导航区域对下拉层的裁切和弹层定位问题；
• 在平板宽度使用汉堡菜单，避免横向导航与搜索区域相互挤压；
• 在宽桌面保持单行导航，在较窄桌面保留两行布局。

3. 精简首页并提供全站导览

• 缩短首屏说明，保留搜索、新生入口和高频直达入口；
• 用六张分类卡片替代重复的场景入口和 12 张平铺内容卡片；
• 每张分类卡片同时提供分类主入口、用途说明和可直接点击的全部子栏目；
• 移除与下方可信度模块重复的三张维护原则卡片；
• 保留可信度边界、内容纠错和开源贡献信息；
• 为分类编号、子栏目导航和键盘焦点状态补充可访问性处理；
• 清理已不再使用的旧首页场景卡片与徽标样式。

4. 修正仓库链接

首页仓库链接和页面底部“在 GitHub 上编辑此页”链接统一指向：

CWNU-Open-Source-Community/SCSWiki

响应式行为

视口范围	导航与首页行为
>= 1200px	六类导航单行展示，下拉菜单正常展开
960–1199px	使用两行导航；允许下拉菜单溢出显示并修正弹层位置
768–959px	隐藏横向菜单，使用汉堡菜单和展开式导航
361–640px	首页六类卡片采用双列紧凑布局，隐藏较长说明，保留全部可点击子栏目
<= 360px	分类卡片切换为单列，避免极窄屏幕文字拥挤

明暗主题、键盘焦点样式和 prefers-reduced-motion 行为保持兼容。

兼容性与变更边界

本次只调整导航组织方式和首页呈现：

• 未移动或重命名 Markdown 页面；
• 未修改任何现有内容 URL；
• 未引入重定向；
• 侧边栏结构保持不变；
• 已有站内链接和外部收藏地址继续有效；
• 未新增运行时依赖；
• 未修改内容数据或部署流程。

因此可作为纯界面与信息架构调整发布。

验证结果

验证环境：Node.js 24.19.0、pnpm 9.15.4。

完整运行：

pnpm check

结果：

• TypeScript 类型检查；
• Markdownlint：109 个文件，0 个错误；
• Prettier 格式检查；
• 内容校验：100 个 Markdown 页面；
• 资料检查：86 个资料文件；
• 站内链接检查；
• Vitest：6 个测试文件、24 个测试全部通过；
• VitePress 生产构建。

人工浏览器检查：

• 默认桌面宽度（约 1336px）：单行导航、分类卡片和下拉菜单；
• 1100px：两行导航、下拉定位和点击行为；
• 820px：平板汉堡菜单及展开菜单；
• 390px：手机双列分类卡片与折叠菜单；
• 320px：极窄屏幕单列卡片；
• 点击“校园与办事 → 办事指南”，确认路由跳转正确；
• 首页各分类主入口及子栏目入口可访问。

PR 创建前已通过本地实时预览向需求方展示桌面端和移动端效果，需求方验收后明确要求提交本 PR。

风险与后续注意事项

• 响应式导航样式依赖 VitePress 默认主题的部分 DOM 类名；未来升级 VitePress 时，应重点复查 768px、960px 和 1200px 附近的断点；
• 新栏目应优先加入 site-map.ts 中合适的分类，避免重新增加大量一级导航项；
• “党团事务”目前复用原 /party/ 页面，后续增加团务内容时可在该栏目内扩展；
• 本 PR 不调整现有页面内容质量，过期信息和待核验页面仍按既有内容治理流程处理。

回滚方式

本次没有内容迁移、数据变更或 URL 变更。如需回滚，直接回退本 PR 即可，无需执行数据恢复或链接迁移。

[pppolf]

@codex review

[chatgpt-codex-connector]

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review	Status	Commit	Review trigger
📝 Code Review	✅ Completed 2026-09-03T16:59:08.131221Z	5264e65	Manual request

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 9b65dfa5a1

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[chatgpt-codex-connector]

Show the tablet navigation screen only when open

At viewport widths from 768px through 959px, this unconditional !important rule overrides VitePress's closed-state display: none, so the fixed .VPNavScreen overlay remains visible even before the hamburger is opened and obscures the page. Restrict this override to the screen's open state (for example, .VPNavScreen.open) so tablet users can access the underlying content.

Useful? React with 👍 / 👎.