今天先用 git status --short 看了一眼工作区，改动范围比单纯的样式修补要大一些。除了内容目录里的私有文章和照片示例，代码侧主要集中在页面背景、文章阅读、首页卡片、摄影页筛选、全局浮动控制面板，以及对应测试用例。
这次工作区里最显眼的变化有几类：
src/components/RandomPageBackground.vue和src/config/randomBackground.ts调整了随机背景的来源配置。src/layouts/PostLayout.astro把文章目录逻辑从页面脚本里拆了出去，改由 Vue 组件接管。src/components/TableOfContents.astro被移除，同时新增了src/components/TableOfContents.vue。src/components/PostCard.astro、src/components/HomePhotoCard.astro和首页展示样式做了卡片信息层级整理。src/pages/photos/index.astro与src/components/PhotoGrid.astro增加了摄影标签筛选能力。src/components/FloatingControls.vue增加了字体模式和更细的特效控制。src/components/SiteModal.astro、src/components/HomeAnnouncement.astro和src/config/announcement.ts补上了公告能力。- 测试目录同步更新了文章目录、随机背景、摄影筛选、文章卡片、静态页面背景等覆盖点。
背景图从随机优先改成可控优先
之前随机背景更像是一个直接请求外部图片接口的组件。这样虽然省事，但也带来一个问题：页面首帧、网络状态和第三方接口质量会影响整体观感。今天的调整把背景来源拆成了更明确的配置。
新的思路是先有一个稳定的 static 模式，默认使用站内本地背景图。等以后真的需要外部随机图或自建接口时，再切换到 external-random-api 或 self-hosted-api。这样做的好处是，页面体验不再被外部接口牵着走。
组件内部也更强调“先有画面，再替换画面”。页面切换时优先显示兜底图，远程图只有在启用对应模式并完成预加载后才替换。这个策略很朴素，但对博客来说很重要：读者打开页面时，稳定比惊喜更优先。
文章目录从内联脚本拆成组件
文章页这次变化很大。原本 PostLayout.astro 里塞了相当多目录控制逻辑，包括滚动监听、章节测量、弹层开关、点击跳转和销毁流程。它能工作，但阅读布局文件时会显得很重。
今天把目录从 TableOfContents.astro 迁移到了 TableOfContents.vue，并在文章页里用 client:idle 加载。这样文章布局只负责把标题、正文、元信息、目录入口拼起来，目录自身的交互状态则交给专门组件管理。
同时，目录数据也收窄为 h2 和 h3 两级。对长文来说，这个层级更接近实际阅读习惯：既能定位章节，又不会把目录变成另一篇文章。
文章信息更像文章信息
文章卡片里原本混着浏览量、热度、阅读时间、分类、字数等信息。今天的调整把列表卡片上的信息压缩为发布日期、分类、字数和访问状态。实时浏览和热度仍然留在文章详情页，但不再挤进每张列表卡片。
这个取舍是合理的。列表页的任务是帮助读者判断“我要不要点进去”，它需要的是标题、摘要、分类、时间和内容体量。浏览量和热度更适合在详情页成为轻量反馈，而不是在列表上抢视觉权重。
新增的 PostMetaIcon.astro 也让这些元信息有了统一图标，不再依赖零散符号。小图标不是装饰，它的作用是让扫描速度更快。
摄影页开始有筛选语义
摄影页这次不只是继续展示图片，而是增加了按标签筛选的入口。photos/index.astro 会从所有照片的 tags 里生成分类按钮，PhotoGrid.astro 给每张照片挂上 data-photo-tags，前端脚本根据按钮切换隐藏或显示卡片。
这是一种很轻的筛选方案，不需要额外路由，也不需要引入状态管理。对当前规模的摄影页来说，这样刚刚好：内容还在静态集合里，交互也足够直接。
全局功能面板继续收拢
浮动按钮里的“视觉设置”改成了更宽泛的“全局功能”。这次新增了字体模式，用户可以在黑体和衬线之间切换；樱花特效强度也从多个按钮改成了滑杆。
这个变化让我觉得整个面板更像一个真正的站点控制台。它不是为了堆功能，而是把那些会影响阅读环境的选项放在同一个地方：字体、特效、文章布局、壁纸模式。
公告也进入站点系统
这轮还新增了公告配置和公告卡片。公告可以出现在首页，也可以进入站点概况弹窗。它的价值不在于“显眼”，而在于给站点一个轻量的运行提示位。
比如后续迁移图床、调整评论策略、说明维护状态，都可以从配置文件里改，不必每次都手动改页面结构。
测试跟着体验一起走
从 git status 看，测试文件也更新了不少。比较关键的包括：
- 随机背景与静态页面背景测试
- 文章目录和阅读增强测试
- 首页卡片和主题测试
- 摄影分类筛选测试
- 受保护文章测试
这些测试说明这次调整不是只改视觉，而是在维护一组页面行为约定。对于个人博客来说，测试不一定要追求覆盖所有细节，但核心交互一旦写进测试，就能避免后面改样式时顺手把行为碰坏。
这次改动留下的方向
今天这轮改造的主线其实很清楚：把体验做得更稳定、更可配置，也更容易继续维护。
背景图从外部随机改成配置驱动，文章目录从布局里抽成组件，卡片信息从热闹变得克制，摄影页开始具备按标签浏览的能力，全局功能面板也从单一视觉开关扩展成阅读环境入口。
这不是一次“加功能越多越好”的更新。它更像是在给博客补骨架：让内容展示、阅读控制、影像浏览和站点提示各自站到合适的位置。之后再继续写文章、发照片、改主题，系统不会那么容易变乱。