diff --git a/src/WidgetSystem/FrontendRenderer.php b/src/WidgetSystem/FrontendRenderer.php index ef141658..8861df3c 100644 --- a/src/WidgetSystem/FrontendRenderer.php +++ b/src/WidgetSystem/FrontendRenderer.php @@ -124,13 +124,17 @@ final class FrontendRenderer { $style = self::style($instance); $affix_attr = !empty($instance['sidebar_affix']) ? ' data-affix="true"' : ''; echo '
'; + if ($own_card) { + // 参考主题:搜索框/一言的中间层是 .theme-box,承载 20px 底部间距与入场动画。 + echo '
'; + echo self::reference_title($instance); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + echo $content; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped + echo '
'; + return; + } echo '
'; echo self::reference_title($instance); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped - if ($own_card) { - echo $content; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped - } else { - echo '
' . $content . '
'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped - } + echo '
' . $content . '
'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped echo '
'; } diff --git a/src/WidgetSystem/Renderers/GeneralRenderer.php b/src/WidgetSystem/Renderers/GeneralRenderer.php index 45b9b30c..76f9f304 100644 --- a/src/WidgetSystem/Renderers/GeneralRenderer.php +++ b/src/WidgetSystem/Renderers/GeneralRenderer.php @@ -55,6 +55,7 @@ final class GeneralRenderer { return ''; } // 参考主题:.yiyan-box 既是卡片也是点击切换的根元素,内部只有 .yiyan。 + // 20px 底部间距由外层 .theme-box 提供(与参考主题一致),卡片自身不带边距。 return jio_get_yiyan_markup([ 'class' => 'yiyan-box main-bg text-center box-body radius8 main-shadow', ]); diff --git a/tests/widget-system/search-quote-card-contract.test.cjs b/tests/widget-system/search-quote-card-contract.test.cjs index 784e5c3a..e5643831 100644 --- a/tests/widget-system/search-quote-card-contract.test.cjs +++ b/tests/widget-system/search-quote-card-contract.test.cjs @@ -18,16 +18,17 @@ test('搜索框与一言小工具只渲染参考主题的一张卡片', () => { assert.doesNotMatch(rendered.search, /jio-widget-shell/); assert.doesNotMatch(rendered.quote, /jio-widget-shell/); - // 搜索框:widget-container > 标题 + 单张 .widget-search 卡片,且复用共享搜索组件。 + // 搜索框:widget-container > .theme-box(承载 20px 底距)+ 标题 + 单张卡片。 assert.equal((rendered.search.match(/class="jio-panel/g) || []).length, 1); - assert.match(rendered.search, /
/); + assert.match(rendered.search, /
/); assert.match(rendered.search, /class="jio-panel widget-search">
/); assert.equal((rendered.search.match(/class="search-input"/g) || []).length, 1); - // 一言:widget-container > 标题 + 单张 .yiyan-box 卡片(点击根元素即卡片)。 + // 一言:同样的 .theme-box 间距层,卡片自身不带底部边距。 assert.equal((rendered.quote.match(/class="yiyan-box/g) || []).length, 1); - assert.match(rendered.quote, /
/); + assert.match(rendered.quote, /
/); assert.match(rendered.quote, /class="yiyan-box main-bg text-center box-body radius8 main-shadow jio-yiyan" data-jio-yiyan>/); + assert.doesNotMatch(rendered.quote, /class="yiyan-box[^"]*theme-box/); assert.match(rendered.quote, /
<\/div>/); });