群头像图标贴顶不居中；成员格子文字区过窄

用户实机反馈的三点，逐项查证后：

1. 图标垂直不居中（真bug，已修）：.group-settings-header span 这条规则把 .group-avatar 一起
   命中了——它本身就是个 span，被改成 flex-direction:column 之后，自己的 place-items:center
   只剩交叉轴（水平）生效，主轴（垂直）退回 flex-start，图标贴着方块顶部。实测头部群头像上边距
   0px、下边距 28.7px，左右各 14.3px，正好对应这个成因。选择器改为
   > span:not(.group-avatar) 精确排除；同时给 .group-avatar 补 align-content/justify-content，
   以后再被外部规则改成 flex 也不会散架。修完三处（头部群头像、成员头像、添加格）实测上下左右
   边距全部对称。

2. 文字区过窄只显示两个字（真问题，已修）：上一版把成员格子宽度收到与头像等宽（3rem），昵称
   被截成"测试..."。按参考图比例重算——那张图里头像约占格子宽七成、相邻头像间隙约头像宽四成，
   且五字昵称完整显示——格子改 4.4rem、头像改 3.6rem、间距 0.5rem。实测"测试昵称A"完整显示
   不再截断。

3. 头像配色：上一版我把兜底头像从饱和蓝底白图标改成了浅蓝底蓝图标，这是自作主张、用户没要求，
   已还原成原来的 #4389df 底 + 白色图标。

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

This commit is contained in:

Your Name

2026-09-03 17:54:22 +08:00

co-authored by

Claude Opus 5

parent f7bc98811e

commit 0ba3577c96

2 changed files with 28 additions and 7 deletions

css/base.min.css

Vendored

+1 -1

View File

File diff suppressed because one or more lines are too long