46 lines
5.5 KiB
Markdown
46 lines
5.5 KiB
Markdown
# 评论区硬切换：1:1 复刻 Zibll（不含表情包/快捷回复）
|
||
|
||
## 现状与结论
|
||
- AKSRT 评论区的 PHP 渲染（`inc/helpers/comments/item.php`、`form-parts.php`、`aksrt-comments.php`）与 JS（`assets/js/core/comments.js` 等走 `aksrt/v1` REST）已是自有代码，DOM 与 Zibll 基本一致（`li#comment-{id} > ul.list-inline > li.comt-main`、`.comment-header/.comment-content/.comt-meta`、`#commentform/.comt-title/.comt-box/.comt-ctrl` 均已对齐）。
|
||
- **样式仍由 vendored `assets/css/main.min.css` 提供**（拼进全站 `build/public.css`；`comments/shell.css` 头部明文"以 vendor 正版样式为准、禁止复制"）——这是本次硬切换的主体：样式归属权切到自有文件，vendor 副本剥离。
|
||
- 快捷回复链路完整存在（schema/PHP/JS/CSS），需全链路删除；表情包已被此前的 commit 删除并有契约测试锁定，保持。
|
||
- 传输层不动：提交/点赞/编辑/删除/置顶仍走 AKSRT REST（含权限回调），不改回 Zibll 的 admin-ajax 协议；UI 与 DOM 对齐 Zibll。
|
||
|
||
## 1. CSS 硬切换（主体）
|
||
- 以参考主题 `C:\Users\Xing\Desktop\zibll\css\main.css` 为准移植评论区规则（与 AKSRT vendored 副本 diff 后以参考版为准）：
|
||
- 新建 `assets/css/frontend/comments/layout.css`：桌面主段（AKSRT main.css 约 9273–9510 对应段：`#comments/#postcomments/#respond/#comment/.commentlist/.comt-*/.comment-*/.comment-signarea/.children/.comment-footer 缩进` 等）+ 散点规则（`.action-comment-like.action-animation`、`.comment-content .box-img`、`.comment-content a`、`.comment-content pre`）。
|
||
- 填充 `assets/css/frontend/comments/mobile-item.css`（现为空壳占位）：移动端 `@media` 内评论规则（`.mobile-fixed/.virtual-input/头像缩进/分页` 等，main.css 约 12208 起）。
|
||
- `shell.css` 重写文件头教条（不再"vendor 提供"），保留 identity chip/medal 补充规则。
|
||
- **剔除**：`.dropdown-smilie/.smilie-icon/.dropdown-quick-often` 与 `img:not(.smilie-icon)` 类选择器。
|
||
- 从 vendored `assets/css/main.css`/`main.min.css` 剥离同批评论区域专属规则（死代码清理、消除双路）。保留：`.comment-widget-item/.comment-mini-lists`（侧栏小部件在非 singular 页使用）及共享选择器（`.pagenav/.theme-pagination/.line-form/.author-box/.avatar-img` 等别处仍用）。
|
||
- 先校验 `main.min.css ≙ minify(main.css)`（esbuild dry-run diff，防漂移），剥离后重新生成 `main.min.css`，再跑 `node tools/build-public-assets.mjs` 重出 bundle。
|
||
|
||
## 2. Markup 1:1 对齐（PHP 小增量）
|
||
- `item.php`：点赞按钮对齐 Zibll `zib_get_comment_like`（SVG 图标 + `<text></text><count>N</count>`，保留 AKSRT `data-comment-action` 接线）；置顶/批准/菜单/注册图标由 FA 换成 Zibll SVG——新增小助手（如 `inc/helpers/comments/icons.php`）移植 `zib_get_svg` 所需 glyph（like/topping/approve/menu_2/signup）；时间/回复链接 tooltip 属性对齐。
|
||
- `aksrt-comments.php` + `form-parts.php`：
|
||
- `!comments_open()` 时整体不渲染（Zibll 行为；当前会渲染标题+列表）。
|
||
- 工具栏渲染 `code→image→link`，补齐缺失的"链接"按钮（新设置 `comment_link`，默认关——Zibll 默认值即 false）。
|
||
- 游客 dropup 补"博客地址"字段（新设置 `comment_user_url_s`，默认关，同 Zibll）。
|
||
- `comt-title` 登录态昵称旁渲染 AKSRT 身份徽章（对应 Zibll VIP 图标位）。
|
||
|
||
## 3. 快捷回复全链路删除 + 死代码清理
|
||
- PHP：`form-parts.php` quick case 与工具栏分支；`aksrt-comments.php` context 的 `quick_s/quick_phrases`；`PostDisplay.php` 的 `quick_phrases` 字段与 `parse_comment_quick_phrases()`；`SchemaPostList.php` 镜像字段。
|
||
- Vue schema：`assets/admin/src/schema/sections/post-list/comment.js` 删 `comment_quick_s/comment_quick_often`。
|
||
- JS：`comment-tools.js` 快捷短语插入逻辑；`ScriptsPart1c.php` 删 `aksrtData.commentQuickPhrases`。
|
||
- 删除死文件：`assets/js/runtime/comment.js(+.min)`、`input-expand.js(+.min)`（已确认无代码引用）。
|
||
- `aksrt-runtime.js` 的 vendor comment 模块 stub 与委托解绑**保留**（vendor `main.min.js` 仍在全国 bundle，防回潮）。
|
||
|
||
## 4. 设置 schema（前后端镜像）
|
||
- 新增 `comment_link`、`comment_user_url_s` 开关（默认 false），镜像到 `SchemaPostList.php` 与 `PostDisplay::get_comment_display_settings()`；`npm run build` 重出 admin SPA。
|
||
|
||
## 5. 测试
|
||
- 更新 `comment-smilies-removal-contract.test.cjs`（文件清单移除已删 runtime 存档）。
|
||
- 新增 `tests/widget-system/comment-hard-cut-contract.test.cjs`：自有 comments CSS 含关键选择器清单；vendor main.css/min 不再含评论区选择器、仍含 `.comment-widget-item`；全库无快捷回复 token（`comment_quick_s/quick-reply-item/dropdown-quick-often/commentQuickPhrases/quick_phrases` 等）；死文件不存在；markup 契约（`<count>`/SVG、工具栏 code/image/link 且无 quick/smilie）。
|
||
|
||
## 6. 构建与验证（不做视觉验收）
|
||
- `php -l` 全部改动 PHP；`node --test` 相关契约测试；`node tools/build-public-assets.mjs`；`npm run build`（admin）。
|
||
- 不启用 Docker 视觉对比环境（按用户要求）。
|
||
|
||
## 风险与对策
|
||
- vendor main.css 手术：先 min-sync 校验；剥离仅限评论专属选择器，逐个 grep AKSRT 模板确认无跨区使用；剥离后选择器清单复核。
|
||
- 评论区规则的 CSS 变量（`var(--…)`）与 bootstrap 类来自 bundle 中更早加载的 tokens.css/bootstrap，`aksrt-comments` 在其后加载，无影响。 |