 tamakyi
|
ab7ccd22ce
|
前端改造：设计令牌 + 卡片层级 + 图表可读性 + 类型色收口 + 窄屏导航
先出方案（frontend-plan-2026-10-09.md）再动手，四批按顺序落地。方法上先存基线、再用同一份
探针在改动前后逐值 diff —— 这批里有 6 处问题只有「量」才看得见，看截图全是正常的。
A 设计令牌（app.css 为主）
- 字阶收敛到 6 档 --fs-xs/sm/md/lg/xl/2xl = 11/13/15/21/26/34px。原来 app.css 有 19 种字号、
模板里另有 54 处内联字号，光 12~15px 之间就挤了 4 档 —— 层级挤不出来，只能靠加粗硬顶。
- 两个「字外档」不是漏的：--fs-control: 16px（窄屏表单控件必须 ≥16px，否则 iOS 聚焦放大整页，
属功能约束）；--glyph-*（✕/箭头/空态图标按控件尺寸定，硬塞进字阶只会把按钮撑坏）。
- 字重收敛到 400/500/600（删掉 650 与 700）。
- 圆角 4 档 --r-*、阴影 3 档 --sh-1/2/3（暗色整套覆盖）、间距 --sp-1..5、
卡片内边距单列 --card-pad（与折叠卡片标题行的负 margin 绑在一起，改一个即改两处）。
- 门禁 TestNoBareFontSizePx：静态扫 app.css 与全部模板，出现 font-size: <数字>px 即红。
B 卡片分主次
- .card--hero / .card（默认）/ .card--quiet 三档。quiet 走「页面底色 + 细边 + 无阴影」——
第一版拿 --bg-2 当底色，实测它与页面底 #f6f7f8 只差 4/255，看不出边界、像破了个洞。
- 首屏 KPI 从「4×2 等重白盒」改成 .kpi-lead（主数 + 一行上下文）+ 5 个常规指标，8 个数字一个没少。
C 图表说人话
- 月度分布：柱底加基线；峰值柱不透明拉满、柱顶标次数（.pv），副标题里不再重复写「最高 N 次」。
- 一天中的分布：把「0/6/12/18 四个数字」换成 6 小时一段的标尺（深夜/上午/下午/晚上），
用同一套 24 列网格，段边界与柱子严格对齐。
- 首页月度图同样加峰值锚点（给 HomeData 补 MaxMonthly，与统计页同口径 maxOf）。
- 空态没动：查下来已经统一（8 页共用 emptystate、局部走 .empty）。
D1 类型色语义化（结论与计划不同，按实测改了）
- 先算对比度：白底上 yellow 1.87 / mint 2.12 / orange 2.20 / green 2.22 / cyan 2.54 / teal 2.57，
6 个色连图形对象 3:1 都到不了；暗底只有 indigo 2.90 不够。
- 所以**没有**把类型色用到 chips / 表格类型列 / KPI 强调 —— 那几处要的是文字色，只会更难读。
这也解释了全站为什么一直只用 8px 小圆点做身份标记。浅色那 6 个色一个没动：
它们是手机端与地图上的同一套身份色，改暗会破坏对应关系。
- 实际做的：色值收口成 --cat-* / --cat-*-soft（26 个变量）；模板 colorof → csscolor / csssoft（19 处）；
暗色只提亮 indigo（2.90 → 3.55:1）；colorOf 成了死代码，删掉。
- ⚠️ 返回值必须是 template.CSS：html/template 的 CSS 过滤器不认识 var()，普通 string 会被静默
换成 ZgotmplZ —— 页面上所有圆点当场变透明，而且不报错、模板测试照过。挂了它等于关掉那道过滤，
所以数据侧色值先过严格校验（只有 # + 6 位 hex 放行），否则 #"><img… 能逃出 style 属性。
守卫 TestCSSColorSurvivesTemplateSanitizer 把两个方向都钉住（做过变异验证）。
D2 窄屏导航
- 改前 ≤620px 靠横向滚动兜底：390 溢 63px、320 溢 133px，「统计」被切成半个字紧贴后面的按钮，
渐隐提示实际看不出来。现在链接本体抽成 {{define "navitems"}} 渲染两遍：桌面 .nav-links 平铺、
窄屏 .nav-menu（原生 <details>，不靠 JS 也能开合）；JS 只补点外面 / Esc / 点链接后收起。
- ⚠️ 顶栏 --z-nav 抬到 1200：菜单是 .nav 的子元素、自己抬不动层叠上下文，不抬就会被地图页的
--z-map-overlay(1100) 盖住。已在 /map 上用 elementFromPoint 实测。
- 守卫 TestNarrowNavCollapsesToMenu 钉「CSS 两半 + 模板两个类 + 渲染两遍」的成对关系。
途中发现并一并修掉的（都只有量 DOM 才看得见）
- Leaflet 的 .leaflet-container 字号是 0.75rem、跟着根字号漂：根 14 → 13px 后地图署名/比例尺
掉到 9.8px（低于本站 11px 下限）、弹窗正文也跟着缩。已按自己的字阶钉死。
- h1..h4 原来只设了字重与 margin、没设字号，靠浏览器默认的 2em/1.5em/1.17em —— 同样跟着根字号漂：
/stats 那两个 h2 从 21px 变成 19.5px，比同页卡片标题大一圈。已显式给出字号。
- <b>/<strong> 浏览器默认 700，比全站最高层级（标题 600）还重，已钉成 600。
回归
- ./scripts/verify.sh：PASS=348 FAIL=0 SKIP=0
- internal/fog 加 -race：PASS=22 FAIL=0 SKIP=0
- JS 单测 34/34
- 移动端 320 / 390 溢出全 0（改前 /admin 在 320 还溢 34px）；桌面 1440 与改前一致（−15 是滚动条宽）
- 全站 7 个页面都没有低于 11px 的文字
说明：A/B 与 C/D 本想拆两笔提交，但 app.css / layout.html / view.go 里两批改动交织，按文件拆不开、
按 hunk 拆又容易做出「中间那笔编译不过」的历史，所以合成一笔、在消息里分段。
|
2026-10-09 17:01:08 +08:00 |
|
|
tamakyi
|
d4e4257a23
|
启动模板自检 + 站长导航放行 + 统计脚本关口收紧
排查：/admin/settings 渲染到一半就断
- 现象：页面在「统计脚本」那张卡片处截断，没有保存按钮、没有 </form></html>，而 HTTP 仍是 200。
- 根因：跑的是旧二进制（改动前编译），磁盘上的模板却是新的。debug=true 下 pageSet()
每次渲染都从磁盘重解析模板，于是新 settings.html 引用了旧 setting.Settings 里没有的
TrackEnabled —— 执行期报错，而 render 只把错误写进日志，客户端只看到半张页面。
- 判据：strings <二进制> | grep -c cleanTrackScript（旧 0 / 新 2）。别用 strings | grep
TrackScript —— config 里本来就有这个名字，旧二进制也命中，是个假信号。
启动自检（防复发）
- template_smoke.go：pageProbe 给 24 个页面各配一份最小可用数据，New() 里全部渲染一遍，
任一页失败就拒绝启动。pageProbe 与 pageFiles 双向校验，新加页面必须补探针，
漏配按失败处理（不是省事）。
- smokeOne 用 recover 兜住方法里的 panic，报「哪一页坏了」而不是崩栈。
- 实测：往 settings.html 插一个不存在的字段 → 启动即报
「模板自检未通过…admin/settings: can't evaluate field …」，退出码 1。
- 门禁 template_smoke_test.go：一条跑全量自检，一条变异验证（探针换成字段更少的类型
必须报错且点名该页）。
站长导航被页面开关误伤
- guardPage 只拦访客（站长始终能访问全部公开页），但导航写的是 {{if .Settings.HasPage "x"}}，
没有 IsAdmin 分支 ⇒ 页面开关一关，站长自己也只剩「主页」一个入口 —— 能访问却点不到。
改成 {{if or .IsAdmin (.Settings.HasPage "x")}}（map/places/timeline/stats/report 五处）。
- 门禁 nav_visibility_test.go：三向不变量（站长仍有全部入口 / 访客一个都没有 /
全开放时访客也看得到），做过变异验证。
- 访客侧「只有主页」是按后台配置应有的状态，没有动数据。
统计脚本关口收紧（cleanTrackScript）
- src= 只在 <script …> 开标签内部找。原来对整段做 strings.Index，脚本体里一句
`img.src=u` 就被命中、整段被判危险而清空 —— 页面照样提示「设置已保存」，站长看不出没挂上。
- 开闭标签从「只拒 shut > open」改成严格配平：末尾未闭合的 <script> 会把页面收尾整段吞进脚本。
- 不再静默：签名改成 (script, warn)，说明码经 ?warn= 回显成人话；判为危险时整段不采纳、
库里原脚本与开关都不动（把站长手上好用的脚本一并清掉更糟）。
- 门禁 TestCleanTrackScript 重写：逐条边界 + 定义性不变量（采纳了非空结果时，
里面开闭标签数必定相等）+ TestTrackWarnMessage（未识别码不得回显）。变异验证做过。
- 文案订正：settings.html 的「conf/app.ini 的 track_script 会作为这里的默认值」有歧义 ——
它不回填文本框，而是「这个框留空时、注入那一刻才回落到 ini」。
其余
- bin/ 目录删除（15 个 exe / 412MB），二进制只留仓库根 rond.exe；
技能 rond-web-verify 与 memory details 十八里 bin/rond.exe 的写法同步改掉。
- 验收：./scripts/verify.sh 全绿且 0 skip（PASS=346 FAIL=0 SKIP=0）。
|
2026-10-09 11:06:41 +08:00 |
|
|
tamakyi
|
4015ddf373
|
时间框跳段 + 弹窗不再脏地址栏 + 统计脚本做成后台开关
时间框（flatpickr allowInput 的手输体验）
- flatpickr 把 <input type=datetime-local> 就地改成 type=text，原生分段编辑器被替换掉；
allowInput 又是「整串解析」语义：实测 parseDate('2026') 只出年份、'202666' 才出月份，
于是「年份很长才跳下一位」；'20260606' 还会被静默错解成 2030-12-06 且不报错。
- 新增 static/js/datetime-input.js：自定义 parseDate（纯数字只收 4/6/8/12/14 位，
歧义与非法日期一律拒）+ 输入引导（段满即补分隔符，敲完 4 位年份立刻跳月份位）。
按标准格式不做自动补零、不前滚；越界值原样保留交报错，不静默改成合法值。
- 三处页面（编辑/照片/专题）共用 attachPicker，配置与原先一致，模板净减 5 行。
弹窗
- window.prompt 会把提示文本与默认值写进地址栏并留进历史（confirm/alert 无此问题）。
- 新增 static/js/prompt-box.js 替代：原生 <dialog>.showModal()，遮罩/Esc/焦点齐全，
旧浏览器降级成页面顶部一条。已换 report.html 复制链接兜底与 edit.html 活动改名。
- 门禁 no_prompt_test.go：静态扫模板禁止 prompt(，并钉住 JS 与 CSS 都在。
统计脚本
- 原来只能改 conf/app.ini（要重启），现在后台「站点设置」可开关 + 填写，默认关闭。
- cleanTrackScript 挡住注入面：开闭 <script> 标签数不配平（提前闭合会让页面散架）、
src 的 javascript:/data: 伪协议、超长截断。注意不能用「出现 </script 就拒」当规则——
百度统计、Umami 贴的就是完整 HTML，正常用法会被挡死。
门禁
- datetime-input.test.js：34 条断言（node 直跑，无依赖）。
- TestCleanTrackScript：逐条边界 + 定义性不变量（任何输入都不得产出含 </script 的非空结果）。
- 三项均做过变异验证，改坏实现都会被对应测试抓到。
实测：真实站点逐键 2→20→202→2026-→2026-06-→2026-06-06T；
统计脚本六个场景（默认关/只填不开/开+URL/后台与登录页不挂/危险输入/关掉恢复）全部符合预期。
全量 internal/web 204 例 0 skip，其余包全绿，gofmt 干净。
|
2026-10-08 18:27:59 +08:00 |
|
|
tamakyi
|
b327bc1230
|
first release
|
2026-09-18 13:05:49 +08:00 |
|