消息首页:群聊头像图标、昨天的时间格式、常联系的人名字截断

对照 docs/images/消息.png 逐项核对消息首页,实测 DOM 后确认三处:

1. 群聊会话的兜底头像画成了单人像:normalizeConversations 没给任何会话设 icon,全部落到
   Avatar 的默认值 person,列表里分不出哪条是群。按 topic 的 grp 前缀区分,群用 group 图标。
   顺带把群的 online 传 undefined——群不存在"在线"概念,之前会给群也渲染一个状态点。

2. 昨天的会话只显示"昨天",参考图是"昨天21:03"带具体时间。实测修复后显示"昨天17:40"。

3. "常联系的人"的名字被截断:格子 3.75rem(50px),而 "kcg051307" 这类用户名需要 52px,
   显示成 "kcg0513...";参考图里这一栏名字是完整显示的。加宽到 4.4rem,实测 59px 可见宽、
   59px 实际宽,不再截断。

另外记录一个未改的观感偏差供决策:这一栏的头像实测占视口宽 10.1%(42.7px / 424px),参考图
里约占 17%,明显小一号。放大属于观感调整不是缺陷修复,没有自行改动。

本轮还做了一次全局层叠扫描(遍历 19 个页面,自动检测图标在容器内不居中、文字被压成 0 高度、
元素溢出视口、意外截断四类问题):除上面这处截断外没有新命中,说明之前群设置页那组 CSS 层叠
冲突是孤立的,没有蔓延到其他页面。

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Your Name
2026-09-03 18:09:00 +08:00
co-authored by Claude Opus 5
parent 0ba3577c96
commit c4189646f4
5 changed files with 22 additions and 11 deletions
+5 -3
View File
@@ -6710,11 +6710,13 @@ div.toast.show {
.messages-frequent-scroll button {
display: flex;
flex: 0 0 3.75rem;
/* 3.75rem(50px) 装不下用户名这类较长的名字(实测 "kcg051307" 需要 52px),会被截成
"kcg0513...";参考图 docs/images/消息.png 里这一栏的名字是完整显示的。放宽到 4.4rem。 */
flex: 0 0 4.4rem;
flex-direction: column;
align-items: center;
width: 3.75rem;
min-width: 3.75rem;
width: 4.4rem;
min-width: 4.4rem;
height: auto;
min-height: 0;
margin: 0;