From 07774c715f9451f91a0133d3264dc30545c0236c Mon Sep 17 00:00:00 2001
From: bigcode <ibigcode@gmail.com>
Date: Mon, 2 Nov 2026 13:19:54 +0800
Subject: [PATCH] =?UTF-8?q?v0.10.22:=20=E8=90=BD=E5=9C=B0=E9=A1=B5=20scaff?=
 =?UTF-8?q?old=20=E6=A0=A1=E5=AF=B9=EF=BC=88smart-gateways=2015=20?=
 =?UTF-8?q?=E8=8A=82=E4=B8=AD=2010=20=E8=8A=82=E5=AF=B9=E9=BD=90=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- EAEL info-box：默认标题外距 8/16（设置覆盖）、title-section 外距改由页面 custom_css p
  控制（修复首页 H4 回归）、图片 display:block、icon-on-top/left 类名
- image widget：支持 space(%) 宽度（92/99/80% 三类图与原站全等）
- 列宽度：Landing 内嵌 section 外层列 populated auto（620→610）与四列行中间列
  calc(100%-8px)（310/302/302/310 实测）
- button widget：selected_icon 图标（star/fire-alt）→ content-wrapper flex + 1em 图标盒
- HTML 块：.ele-choose-prtocol/.ele-choose-platform ul 去 UA 外距
- 实测 smart-gateways 10/15 节与原站误差 ≤8px；首页 626ce49/9f202ea 回归修复
- 待办已记入 docs：8e90920 EAEL tabs、391a1ee Toggle DOM、a36c301 内嵌模板 27143
- bun test 11 pass；版本 0.10.22
---
 docs/sections-inventory.md            | 11 +++++++++
 package.json                          |  2 +-
 src/components/elementor/Renderer.tsx | 28 ++++++++++++++++++++---
 src/styles/app.css                    | 33 +++++++++++++++++++++++++++
 4 files changed, 70 insertions(+), 4 deletions(-)

diff --git a/docs/sections-inventory.md b/docs/sections-inventory.md
index 34bf6a1e4..ef2de5f43 100644
--- a/docs/sections-inventory.md
+++ b/docs/sections-inventory.md
@@ -67,6 +67,17 @@
   ShopFilters/ShopProducts 注入。筛选 URL 用查询参数（原站 WPC 为 /shop/type-som/ 美化链接），
   术语顺序/计数来自导入数据（term taxonomy 顺序 + product_attribute_map 计数）。
 
+### 1b. 落地页 /landing-pages/$slug（智能网关页已校对，v0.10.22 进行中）
+- 原站落地页为 post（如 smart-gateways legacy 6509）Elementor 直出，经 catch-all 路由渲染。
+- smart-gateways 15 节中 10 节已与原站逐项对齐（541ea84/49dcb11/dcfbe08/de5742a/9b87079/
+  7c15af8/68babbb/028b4bc/5745b4f/2fee235，误差 ≤8px），期间修复：EAEL info-box
+  默认标题外距/图片 block/标题 margin 设置、image `space` 宽度、列 populated auto 语义、
+  按钮图标（star/fire）、HTML 块 ul 默认外距。
+- 待办：8e90920 EAEL 高级标签页（原站 headless JS 未初始化，需按真实交互态校对）、
+  391a1ee toggle 手风琴（需换 Elementor toggle DOM + 默认全收起 + 28/58px 标题样式）、
+  a36c301 `[elementor-template id="27143"]` 内嵌模板（含 posts.cards，需模板导入 +
+  短代码渲染 + posts 预取）。
+
 ### 2. 方案页
 - S1 `/solution/` 列表入口页
 - S2 `/solution/$slug` 落地页:与首页同款 Elementor 直出,版块逐页不同
diff --git a/package.json b/package.json
index 89a8b0ef0..7860146cd 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "dusuniot-rebuild",
-  "version": "0.10.21",
+  "version": "0.10.22",
   "private": true,
   "type": "module",
   "scripts": {
diff --git a/src/components/elementor/Renderer.tsx b/src/components/elementor/Renderer.tsx
index ba419c7b9..6bf6919d7 100644
--- a/src/components/elementor/Renderer.tsx
+++ b/src/components/elementor/Renderer.tsx
@@ -863,7 +863,8 @@ function ImageWidget({ settings }: { settings: Record<string, unknown> }) {
   const linkProps = link ? { href: link, ...(isExternal ? { target: "_blank" as const } : {}) } : undefined;
   // 图片宽度设置（Elementor 生成 `.elementor-element-X img{width:57%}`；页脚 logo 57%、
   // Google 徽章 300px）：作用于 img 本身，a 为 inline-block 时按固有宽度收缩（与原站一致）
-  const imgWidth = sizeCss(settings.width);
+  // 图片宽度：Elementor width 设置优先；本主题另有 space(%) 控制图片宽度（实测 63dd8a2=92%）
+  const imgWidth = sizeCss(settings.width) || sizeCss(settings.space);
   const img = <img className={animCls || undefined} src={url} alt={s(img0.alt)} loading="lazy" style={imgWidth ? { width: imgWidth } : undefined} />;
   const cls = ("el-image " + (animCls || "")).trim();
   return (
@@ -1132,13 +1133,26 @@ function ButtonWidget({ el, settings }: { el: ElElement; settings: Record<string
   if (fwt !== undefined && fwt !== null && fwt !== "") style.fontWeight = Number(fwt) || fwt as number;
   const hoverBg = s(settings.button_background_hover_color);
   const hoverColor = s(settings.hover_color);
+  // 图标按钮（原站 Landing 的 New/HOT 徽章）：Elementor DOM = content-wrapper(flex gap 5)
+  // > button-icon(1em) + button-text，图标 14px 使按钮宽 +19px
+  const icon = s((settings.selected_icon as { value?: string } | undefined)?.value);
+  const content = icon ? (
+    <span className="elementor-button-content-wrapper">
+      <span className="elementor-button-icon">
+        <i className={icon} aria-hidden="true" />
+      </span>
+      <span className="elementor-button-text">{text}</span>
+    </span>
+  ) : (
+    text
+  );
   return (
     <div style={{ textAlign: (s(settings.align) as CSSProperties["textAlign"]) || "left" }}>
       {hoverBg || hoverColor ? (
         <style>{`[data-el="${el.id}"] .el-btn:hover{${hoverBg ? `background:${hoverBg};` : ""}${hoverColor ? `color:${hoverColor};` : ""}}`}</style>
       ) : null}
       <a className="el-btn" href={link || "#"} style={style} target={(settings.link as { target?: string } | undefined)?.target === "_blank" ? "_blank" : undefined} rel="noreferrer">
-        {text}
+        {content}
       </a>
     </div>
   );
@@ -1277,12 +1291,20 @@ function EaelInfoBoxWidget({ settings }: { settings: Record<string, unknown> })
   const tag = s(settings.eael_infobox_title_tag);
   const Tag = (["h1", "h2", "h3", "h4", "h5", "h6", "div"].includes(tag) ? tag : "div") as "div";
   const left = s(settings.eael_infobox_img_type) === "img-on-left" || s(settings.eael_infobox_img_type) === "icon-on-left";
-  const cls = "eael-infobox" + (left ? " icon-on-left" : "");
+  // 原站 EAEL DOM：.eael-infobox.icon-on-top / .icon-on-left（配图上方/左侧布局）
+  const cls = "eael-infobox " + (left ? "icon-on-left" : "icon-on-top");
   // 标题排版/颜色（H14 实测 fs 1.25rem/700/#0D152E；内容排版 hover 键原站未生效,不采用）
   const titleStyle: CSSProperties = {
     ...typographyCss(settings, "eael_infobox_title_typography"),
     ...(s(settings.eael_infobox_title_color) ? { color: s(settings.eael_infobox_title_color) as string } : {}),
   };
+  // 标题外距（EAEL：设置非空时覆盖默认 8px 0 16px；570df98 显式 0 0 0 0，02956ef 走默认）
+  const tmRaw = settings.eael_infobox_title_margin as Record<string, unknown> | undefined;
+  const tmSet = !!tmRaw && ["top", "right", "bottom", "left"].some((k) => tmRaw[k] !== "" && tmRaw[k] != null);
+  if (tmSet) {
+    const tm = paddingCss(tmRaw);
+    if (tm) titleStyle.margin = tm;
+  }
   return (
     <div className={cls}>
       {img?.url ? (
diff --git a/src/styles/app.css b/src/styles/app.css
index 0e2534cce..6330ef690 100644
--- a/src/styles/app.css
+++ b/src/styles/app.css
@@ -45,6 +45,8 @@
 .fa-facebook-f::before { content: "\f39e"; }
 .fa-discord::before { content: "\f392"; }
 .fa-tiktok::before { content: "\e07b"; }
+.fa-star::before { content: "\f005"; }
+.fa-fire-alt::before { content: "\f7e4"; }
 .fa-twitter::before { content: "\f099"; }
 
 /* # 字体 Font Awesome Solid / Regular（页脚返回顶部图标 fas fa-chevron-up、
@@ -532,6 +534,8 @@
   .eael-infobox .infobox-content .infobox-title-section .title {
     width: max-content; max-width: 100%; overflow-wrap: break-word; word-break: break-word;
   }
+  .eael-infobox.icon-on-top .infobox-content .title { margin: 8px 0 16px; line-height: 1.2; }
+  .eael-infobox.icon-on-top .infobox-icon img { display: block; width: 100%; height: auto; }
   .eael-infobox.icon-on-left .infobox-content .title { line-height: 1; margin: 0 0 10px 0; }
   .eael-infobox .infobox-content p { margin: 0 0 15px; }
   /* 内容里的 ul/ol：hello-elementor 主题 reset（H14 药丸列表实测 margin 0，
@@ -979,3 +983,32 @@ body.dialog-prevent-scroll { overflow: hidden; }
 [data-el="d761846"] .woocommerce-pagination ul.page-numbers .current { background: #E9E6ED; color: #816F98; }
 [data-el="d761846"] .woocommerce-pagination ul.page-numbers .dots { color: #333; }
 
+
+/* Elementor 按钮图标布局（Landing 页 New/HOT 徽章：flex 内容行 + 1em 图标） */
+.el-btn .elementor-button-content-wrapper { display: flex; align-items: center; gap: 5px; }
+.el-btn .elementor-button-icon { display: flex; align-items: center; justify-content: center; width: 1em; height: 1em; line-height: 1; }
+.el-btn .elementor-button-icon i { font-size: 1em; line-height: 1; width: 1em; text-align: center; }
+.el-btn .elementor-button-text { display: block; }
+
+/* Landing 智能网关：四列卡片行中间两列 populated 宽 = 100% - 8px（左右 margin 4px，
+ * 首末列维持 100% 溢出语义，原站 flex 收缩实测 310/302/302/310） */
+[data-el="a3bcae8"] .el-col:nth-child(2) > div,
+[data-el="a3bcae8"] .el-col:nth-child(3) > div,
+[data-el="dfb16c6"] .el-col:nth-child(2) > div,
+[data-el="dfb16c6"] .el-col:nth-child(3) > div { width: calc(100% - 8px) !important; }
+
+/* Landing 智能网关 de5742a：内嵌 section 的外层列带 margin-right/left 10px，
+ * populated 宽 auto（原站 620 列 → 610 内层节，内层列 305） */
+[data-el="64ebb3a"] > div,
+[data-el="fce8a34"] > div { width: auto !important; }
+
+/* Landing 智能网关：协议入口 HTML 块（.ele-choose-prtocol）列表无 UA 外边距
+ * （原站主题 reset：ul margin 0；custom_css 只给了 padding 0） */
+.content-html .ele-choose-prtocol ul,
+.content-html .ele-choose-platform ul { margin: 0; }
+
+/* Landing 智能网关 9b87079/7c15af8：内嵌 section 外层列同样带 margin（620 → 610） */
+[data-el="491df15"] > div,
+[data-el="71f7329"] > div,
+[data-el="2ec9a62"] > div,
+[data-el="7bdf4c0"] > div { width: auto !important; }