FamilyBook

Files

T

laoyang 218cdf74fc 家谱：修「线又错位」（我上一版的居中写法在库里不成立）+ 框宽收成头像宽 + 去掉悬停提示

用户 2026-10-03 反馈三条。**第一条是我上一版引入的回归，先说清楚**。

一、「画线又有点错位了」—— 上一版把居中从 transform 换成 `inset:0 + margin:auto`，
    这一步在**这个库里不成立**：
      含块是库的 `div.card`，它在 Cartesian 模式下只有 **1.8px 宽**
      （宽度由内部一个空 div 撑出来，卡片是溢出绘制的）。
      `inset:0` + `margin:auto` 的"居中"依赖"容器比元素宽" —— 容器只有 1.8px 时
      auto 外边距分不出任何空间，卡片直接被摆在容器左上角、整体**右移 53.1px**。
    实测（1600×1000、库缩放 0.9）：**每一张**卡的中心都偏在节点中心右边 53.1px
    （是固定的布局偏差，不是随机抖动）→ 连线仍然画在节点上，于是全部错位。
    正解：`left/top: 50%` + **半个自身尺寸的负外边距**
    （`margin-left: calc(var(--kin-w) / -2)`）—— 位置完全由布局决定，
    **不经过 transform**，所以库那条 `:hover { transform: … }` 也顶不掉它。
    ⚠️ 负外边距用 calc 与尺寸共用变量，不写死 -59/-66（迟早脱节）。
    ⚠️ 这条路上已经栽过两次，两种错写法都别再回去：
       · `transform: translate(-50%,-50%)` → hover 时被库覆盖，卡片跳半张（53×58px）；
       · `inset:0 + margin:auto` → 容器 1.8px 宽，卡片整体右移 53px、连线错位。

二、「外面那个框又变宽了；宽度和头像图片一致，下面显示名字就行了」：
    卡片 118 → **98px**（= 96 头像 + 左右各 1px 边框），横向 padding 归零，
    头像改 `width: 100%` 占满卡片内宽 —— 于是**边框刚好贴着头像**，
    框里不再有多余的横向空白；头像下面就是名字（+ 与我的称呼）。
    ⚠️ 98×116 与 JS 的 `setCardDim` 必须同源（库按它算间距与连线落点），
       所以两边都改用常量：CSS 的 `--kin-w/--kin-h` ↔ JS 的 `KIN_W/KIN_H`。

三、「鼠标放在名字上后显示了一行字：资料、以他为中心 —— 没必要，不要显示」：
    那两行是我上一版加的悬停提示（`.kin-hint`），**整个删掉**（模板 + CSS）。

验证：
  · 家谱可视化检查 29 → **34** 条全过，新增五条正是这次的守卫：
    ⑮ 每张卡正对节点中心（改坏时实测 dx=53.1）· ⑯ 框宽 = 头像宽（≤2px）
    · ⑯b 尺寸不是退化的 0（防止"一起变 0"也算过）· ⑰ 无 .kin-hint
    · ⑱ 头像下面是名字。
  · 反向验证：把居中改回 `inset:0 + margin:auto` → ⑮ 立刻红（dx=44.1），
    还原后复绿（断言不是永远绿的）。
  · 连线端点独立核对：12 个端点里 9 个落在卡片附近，另 3 个是
    **夫妻之间那段连接线**（画在两卡之间，本来就该在两卡之间）。
  · e2e 773/0 · 第 5 轮专项 91/0 · 几何 428/0 · 移动端 684/0 · 交互 97/0。
  · 部署脚本更新/新增静态断言：允许 transform 之外的居中方式但**禁止那两种错写法**
    （transform 居中 / inset:0）、必须有 `margin-left: calc(var(--kin-w) / -2)`、
    JS 与 CSS 的宽度必须一致、`kin-hint` 不许回来。
  · 线上两个文件 md5 与本地一致；kin-hint=0、--kin-w: 98px 在位。

2026-10-03 17:49:10 +08:00

auth

阶段 0 完整版：名册 + 账号 + 安装向导 + 设置（宣纸主题）

2026-09-30 00:49:53 +08:00

calendar

v24 第 5 轮：十条清单（天气填城市 / 输入即筛选 / 看板列＝看板 / 账本盘点折线图 / 纪念日分类）

2026-10-03 15:01:38 +08:00

days

v24 第 5 轮：十条清单（天气填城市 / 输入即筛选 / 看板列＝看板 / 账本盘点折线图 / 纪念日分类）

2026-10-03 15:01:38 +08:00

kin

家谱：修「线又错位」（我上一版的居中写法在库里不成立）+ 框宽收成头像宽 + 去掉悬停提示