fix(hero): align header slider title/search stack with zibll

Put hero main title/subtitle in search before_html (document flow),
move the search overlay outside the swiper as a sibling, and reset
search/slide-text positioning to zibll tops so title and search no
longer overlap.
This commit is contained in:
2026-07-17 23:00:33 +08:00
parent e7ccc4f069
commit 397231ca75
12 changed files with 476 additions and 439 deletions
@@ -117,6 +117,25 @@ class SchemaPageDisplay {
['key' => 'header_components_search_popular_limit', 'label' => '热词数量', 'type' => 'number', 'default' => 5, 'min' => 1, 'max' => 20, 'dependsOn' => ['key' => 'header_components_search_show_keywords', 'value' => true]],
['key' => 'header_components_search_show_input_cat', 'label' => '显示分类搜索', 'type' => 'switch', 'default' => false, 'dependsOn' => ['key' => 'header_components_search_enabled', 'value' => true]],
['key' => 'header_components_search_show_type', 'label' => '显示类型切换', 'type' => 'switch', 'default' => false, 'dependsOn' => ['key' => 'header_components_search_enabled', 'value' => true]],
[
'key' => 'header_components_search_before_html',
'label' => '搜索上方额外内容',
'type' => 'textarea',
'sanitize_type' => 'html',
'default' => '<div class="em16 font-bold mb10">更优雅的Wordpress主题</div>
<div>这是导航栏幻灯片多功能组件,可在后台进行配置</div>',
'dependsOn' => ['key' => 'header_components_search_enabled', 'value' => true],
'help' => 'Hero 主标题/副标题写在这里(支持 HTML)。勿依赖幻灯片文案,以免与搜索重叠;请注意组件总高度。',
],
[
'key' => 'header_components_search_after_html',
'label' => '搜索下方额外内容',
'type' => 'textarea',
'sanitize_type' => 'html',
'default' => '',
'dependsOn' => ['key' => 'header_components_search_enabled', 'value' => true],
'help' => '支持 HTML;请注意组件总高度。',
],
]],
['key' => 'cards', 'title' => '图标卡片样式', 'fields' => [
['key' => 'header_components_filter_blur_devices', 'label' => '容器模糊设备', 'type' => 'checkbox', 'default' => [], 'dependsOn' => ['key' => 'header_components_cards_enabled', 'value' => true], 'options' => [
+15 -1
View File
@@ -67,7 +67,7 @@ class DisplayRuntime {
/**
* Hero 搜索组件详细配置(PC/移动分别 + 子选项)
*
* @return array{pc:bool,mobile:bool,show_keywords:bool,popular_limit:int,show_input_cat:bool,show_type:bool,keywords:string[],categories:array,type_options:array}
* @return array{pc:bool,mobile:bool,show:bool,show_keywords:bool,popular_limit:int,show_input_cat:bool,show_type:bool,keywords:string[],categories:array,type_options:array,before_html:string,after_html:string}
*/
public static function get_header_components_search_config(): array {
$settings = Settings::get_all();
@@ -83,6 +83,11 @@ class DisplayRuntime {
$show_cat = !empty($settings['header_components_search_show_input_cat']);
$show_type = !empty($settings['header_components_search_show_type']);
// Mobile: hide hot keywords to keep the overlay short (zibll parity).
if ($is_mobile) {
$show_kw = false;
}
$keywords = [];
if ($show && $show_kw) {
$raw = $settings['hot_search_keywords'] ?? '';
@@ -108,6 +113,13 @@ class DisplayRuntime {
}
}
$before_html = isset($settings['header_components_search_before_html'])
? (string) $settings['header_components_search_before_html']
: '';
$after_html = isset($settings['header_components_search_after_html'])
? (string) $settings['header_components_search_after_html']
: '';
return [
'pc' => $pc_on,
'mobile' => $mobile_on,
@@ -119,6 +131,8 @@ class DisplayRuntime {
'keywords' => $keywords,
'categories' => $categories,
'type_options' => $type_options,
'before_html' => $before_html,
'after_html' => $after_html,
];
}