首页全天日程与下方白块无间距 #61

New Issue

2026-11-05T05:31:33Z

laoyang commented

2026-11-05 05:31:33 +00:00

首页全天日程与下方白块无间距（视觉 bug）

用户（2026-11-05）

「如果是全天日程，现在在上面显示的内容，跟下面那个白色的块是上边齐平的，
这样视觉效果很不好。应该让它比如"全天日程实验室值班"上边，
跟白色的框之间有一点距离，也就是它们之间有几个像素的空隙，
这样看起来更舒服一些。」

现象

┌─────────────────────────┐
│ 全天日程实验室值班        │  ← 紧贴
├─────────────────────────┤  ← 白块上边缘，没有空隙
│  时间 ｜ 内容             │
└─────────────────────────┘

改法

全天日程那一行下方加 8~12vp 间距（margin({ bottom: 10 }) 或
父容器 space 加大）。

⚠️ 只在全天日程时加，普通日程不需要（它们本来就有时间行隔开）。

验收

全天日程文字与下方白块之间有可见空隙（约 10vp）
普通日程不受影响

为什么单独建单

纯视觉间距问题，可独立验收，不涉及交互改造。

# 首页全天日程与下方白块无间距（视觉 bug） ## 用户（2026-11-05） > 「如果是全天日程，现在在上面显示的内容，跟下面那个白色的块是上边齐平的， > 这样视觉效果很不好。应该让它比如"全天日程实验室值班"上边， > 跟白色的框之间有一点距离，也就是它们之间有几个像素的空隙， > 这样看起来更舒服一些。」 ## 现象 ``` ┌─────────────────────────┐ │ 全天日程实验室值班 │ ← 紧贴 ├─────────────────────────┤ ← 白块上边缘，没有空隙 │ 时间｜内容 │ └─────────────────────────┘ ``` ## 改法全天日程那一行**下方**加 8~12vp 间距（`margin({ bottom: 10 })` 或父容器 `space` 加大）。 ⚠️ 只在**全天日程**时加，普通日程不需要（它们本来就有时间行隔开）。 ## 验收 - [ ] 全天日程文字与下方白块之间有可见空隙（约 10vp） - [ ] 普通日程不受影响相关：#59（首页总纲） --- ### 为什么单独建单纯视觉间距问题，可独立验收，不涉及交互改造。

laoyang commented

2026-11-05 07:52:36 +00:00

二次反馈修复（2026-11-05 15:50）

用户反馈原话：

「"首页""今天的日程"这几个字的颜色什么的没变呀，它应该变成跟这个主题颜色一样，
也就是跟日程的主题颜色一样。右边11条，这个和那个"新建"挨得太近了。
"新建"前面就不用再加加号了，没必要。全天日程不是下面太窄了，是上面。
现在上面那个边和它下面白色框的边是重合的。近期任务的颜色、最近纪念日的颜色、
最近观影的颜色，都没有发生改变。」

① 标题颜色没变 —— 上一轮改了组件，却没改调用点

FbSectionTitle 上一轮确实加了 @Param accent（带默认值 ''），
但首页 6 处调用点一处都没传。

上一轮我 grep 到的 7 个 accent: 全部落在 FbEventSheet / FbTaskPanel /
FbDayEditSheet / FbMovieDetailSheet / FbPersonSheet 上 ——
那些组件本来就自带 accent 参数，与标题无关。我把「已传」当成了完成证据。

因为组件的默认值是空串，空串 ⇒ titleColor() 退回 #8A7A6D 灰，
所以组件改得再对，不传就是不变 —— 这正是用户看到的现象。

修法：5 处调用点补 accent:（往年的今天保持默认灰，它不是模块）：

区块	传入
今天的日程	`this.calAccent()`
近期任务	`this.taskAccent()`
最近纪念日	`this.daysAccent()`
最近观影	`this.moviesAccent()`
联系人	`this.peopleAccent()`

颜色不硬编码，全部经 fbModuleOf(...) → fbThemeVars(...).brand，
用户改模块配色后首页会跟着变。

② 条数与「新建」挨太近

extra 后面直接接胶囊，Row 无 space、胶囊无 margin ⇒ 贴死。
给胶囊加 margin({ left: 12 })。

选 12 而不是 8：胶囊有实体底色，视觉间距比纯文字显得更紧，
8vp 看着仍像一坨，12vp 才有清晰分隔。

③ 去掉「＋」前缀

'＋新建' → '新建'，'＋新增' → '新增'（共 5 处）。
连带把 3 处空态提示的「点右上角「＋新建」」同步改成「点右上角「新建」」——
按钮上已经没有加号了，提示文案再带加号会指错。

④ 全天日程的问题在上面，不在下面

上一轮我改的是 bottom: 6 → 12，方向搞反了。

实际结构：FbDayEventPanel 给 FbDayTimeline 的 padding 是
{ left, right, bottom: 8 } —— 没有 top。
所以第一个全天色块的上边直接压在白卡片的顶边上，色块与卡片边缘重合，
看起来像被裁掉一截。

修法：改 { top: 10, bottom: 12 }。上下都留白——
上边接卡片边缘、下边接时间轴，两处都是「块与块之间」，都该有呼吸。

⚠️ 只加在有全天日程的分支里。没有全天时时间轴贴顶是正常的
（顶部有小时刻度，视觉上不构成挤压）。

## 二次反馈修复（2026-11-05 15:50）用户反馈原话： > 「"首页""今天的日程"这几个字的颜色什么的没变呀，它应该变成跟这个主题颜色一样， > 也就是跟日程的主题颜色一样。右边11条，这个和那个"新建"挨得太近了。 > "新建"前面就不用再加加号了，没必要。全天日程不是下面太窄了，是上面。 > 现在上面那个边和它下面白色框的边是重合的。近期任务的颜色、最近纪念日的颜色、 > 最近观影的颜色，都没有发生改变。」 ### ① 标题颜色没变 —— 上一轮改了组件，却没改调用点 `FbSectionTitle` 上一轮确实加了 `@Param accent`（带默认值 `''`），但**首页 6 处调用点一处都没传**。上一轮我 grep 到的 7 个 `accent:` 全部落在 `FbEventSheet` / `FbTaskPanel` / `FbDayEditSheet` / `FbMovieDetailSheet` / `FbPersonSheet` 上 —— **那些组件本来就自带 `accent` 参数**，与标题无关。我把「已传」当成了完成证据。因为组件的默认值是空串，空串 ⇒ `titleColor()` 退回 `#8A7A6D` 灰，所以**组件改得再对，不传就是不变** —— 这正是用户看到的现象。修法：5 处调用点补 `accent:`（往年的今天保持默认灰，它不是模块）： | 区块 | 传入 | |---|---| | 今天的日程 | `this.calAccent()` | | 近期任务 | `this.taskAccent()` | | 最近纪念日 | `this.daysAccent()` | | 最近观影 | `this.moviesAccent()` | | 联系人 | `this.peopleAccent()` | 颜色不硬编码，全部经 `fbModuleOf(...)` → `fbThemeVars(...).brand`，用户改模块配色后首页会跟着变。 ### ② 条数与「新建」挨太近 `extra` 后面直接接胶囊，`Row` 无 `space`、胶囊无 margin ⇒ 贴死。给胶囊加 `margin({ left: 12 })`。选 12 而不是 8：胶囊有实体底色，视觉间距比纯文字显得更紧， 8vp 看着仍像一坨，12vp 才有清晰分隔。 ### ③ 去掉「＋」前缀 `'＋新建'` → `'新建'`，`'＋新增'` → `'新增'`（共 5 处）。连带把 3 处空态提示的「点右上角「＋新建」」同步改成「点右上角「新建」」—— 按钮上已经没有加号了，提示文案再带加号会指错。 ### ④ 全天日程的问题在上面，不在下面上一轮我改的是 `bottom: 6 → 12`，**方向搞反了**。实际结构：`FbDayEventPanel` 给 `FbDayTimeline` 的 padding 是 `{ left, right, bottom: 8 }` —— **没有 top**。所以第一个全天色块的**上边直接压在白卡片的顶边上**，色块与卡片边缘重合，看起来像被裁掉一截。修法：改 `{ top: 10, bottom: 12 }`。上下都留白—— 上边接卡片边缘、下边接时间轴，两处都是「块与块之间」，都该有呼吸。 ⚠️ 只加在**有全天日程的分支**里。没有全天时时间轴贴顶是正常的（顶部有小时刻度，视觉上不构成挤压）。

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: laoyang/FamilyBook#61