更新页面效果

.workbuddy/memory/2026-07-31.md

@@ -95,3 +95,29 @@
 - 授权模态框模板/样式保持不变（轻触开启 → 播放；暂不开启 → 挂 `armAutoplay` 兜底）。
 
 验证：`vite build --outDir dist-chk-<timestamp>` 通过（EXIT=0）。无残留 `pendingMusicAuth` 引用。
+
+---
+
+## 2026-07-31（第七版）滚动修复+速度参数+错落双图+单图宽度+边框扩展+背景装饰
+
+用户提出 5 大块需求（附截图），全部实现并浏览器实测验证：
+
+1. **首屏滚动修复+后台速度参数**
+   - 根因：容器带 `scroll-smooth` 类，CSS smooth 会劫持 JS 的 `scrollTop` 赋值，free 模式每帧 +=0.8 全被转成平滑动画 → 卡顿跳帧。已移除该类并注释警示。
+   - snap 切换动画时长不可控（behavior:'smooth' 浏览器自定）→ 自研 `smoothScrollTo`（rAF + easeInOutQuad，时长可配）。
+   - 新配置：`freeScrollInterval`(ms,默认50,自由滚动间隔,setInterval 驱动)、`pageSwitchDuration`(ms,默认800,翻页动画时长)。后台「视觉与动效」加滑块+数字输入。
+   - 循环逻辑：snap/free 到底后回第一屏继续；`handleUserInteraction` 取消程序化动画避免争抢。
+
+2. **错落双图溢出修复**（先实测定位再修）
+   - 实测根因：保存的配置中该页 `height:'auto'` → section 仅 643px（视口 844），容器又写死 `h-[50vh]`，与页高脱钩 + `bottom-4` 悬空 → 第二图被裁/挤压。
+   - 修复：容器改 `clamp(320px,54vh,460px)` 封顶，图片贴容器边缘（bottom-0/right-0），68%/72% + 60%/60% 比例错落。实测修复后两图完整不出界。
+
+3. **单图宽度铺满**：`page.singleWidth`(default|full) + `page.singleKeepRatio`(bool)。full+保比例 → 新增 `gf-natural` 辅助类（img height:auto）；full+不保 → aspect 4/5 裁切。后台单图版式显示该配置（单选+开关），实测铺满渲染正常。
+
+4. **边框扩展5组**：gf-shadow(阴影浮起)/gf-ink(墨黑描边)/gf-card(悬浮卡片)/gf-lace(虚线文艺)/gf-glow(柔光金晕)，共 11 种，后台预览复用。
+
+5. **背景装饰优化**：petalDrift/heartSway 从 margin-left（每帧触发布局）改嵌套内层 transform（全合成层，性能修复）；爱心三层景深(远小淡模糊/近大清晰)、花瓣两层景深；新增 bg-glow 柔光层(淡金/淡粉 radial 光斑缓慢漂移)。
+
+实测工具：agent-browser（playwright-cli 未装）。坑：后台是 history 模式，URL 是 `/admin` 不是 `/#/admin`；eval 多行 JS 引号易炸，写临时文件 `eval "$(cat x.js)"` 最稳；截图保存在 daemon 的 cwd（D:/myCode/hunliji/dev/_shots）。
+
+验证：`vite build` 通过（EXIT=0）；浏览器实测 overlap/single-full/admin 控件均正常。注：沙箱浏览器加载不了 unsplash（显示裂图），localhost:8080 上传图正常。

.workbuddy/memory/MEMORY.md

@@ -0,0 +1,20 @@
+# 婚礼请柬项目 · 长期备忘
+
+## 架构
+- 前端 `vite-tailwindcss`：Vue3+Vite6+Tailwind4+Pinia+antd，路由 history 模式（`/admin` 非 hash），dev 端口 8888，代理 `/api` → 8080。
+- 后端 `hunliji-api`：Go/Gin+GORM+MySQL，改完必须 `go build` 并重启旧进程才生效（404 多半是旧二进制）。
+- 配置存后端单条 JSON，前后端均做旧字段兼容（musicUrl→musicList、缺省 height/borderStyle/singleWidth/速度参数）。
+
+## 关键坑（不要再踩）
+1. **滚动容器绝不能加 `scroll-smooth`**：CSS smooth 会劫持 JS 的 scrollTop 赋值，free 自动滚动会严重卡顿。snap 翻页用自研 rAF 动画（`smoothScrollTo`，时长=pageSwitchDuration）。
+2. **动画摇曳禁用 margin-left**（每帧触发布局）：外层跑位移、内层元素跑 transform 摇曳（petal/petal-inner、heart-bubble/heart-inner 模式）。
+3. **相册页高与图片容器要联动**：页高可能 auto/80vh，图片容器写死 vh 会脱钩溢出 → 用 clamp 封顶 + 图片贴容器边缘。
+4. `gf-frame` 不设 width/height（尺寸交给版式包装类），`gf-natural` 用于保持原始比例。
+
+## 环境
+- 本机"安全删除"损坏：rm 常失败，vite build 用 `--outDir dist-chk-<ts>` 新目录验证，临时目录需手动清。
+- 沙箱网络隔离：测宿主机服务要 dangerouslyDisableSandbox；沙箱浏览器加载不了 unsplash（裂图正常），localhost 图正常。
+- 浏览器实测用 agent-browser（playwright-cli 未装）：多行 eval 写临时文件再 `eval "$(cat f)"`；截图落在 daemon cwd；admin 需先 localStorage 注入 admin_token；可用 network route mock /api/config 验证配置渲染（不动数据库）。
+
+## 凭证
+后台 admin / admin123（env 可覆盖）。