fix(header): 1:1 zibll overlay icon cards for top multifunc component

Rebuild header-slider card DOM/CSS against zib_header_slide + zib_icon_cover_card so shared/individual backgrounds, flex gutters, and badge icons match the reference theme.
This commit is contained in:
kate522 committed 2026-07-24 10:30:22 +08:00
1 parent bbdeeafc80
commit e35011f2c0
7 files changed
+384 -463

No files matched your search

+44 -25
View File
@@ -152,33 +152,52 @@ $render_icon_cards = static function () use ($show_cards, $icon_cards, $card_bg_
if (!$show_cards || empty($icon_cards)) {
return;
}
/**
* Overlay icon cards — 1:1 zibll zib_header_slide() card module.
*
* show_widget_bg (shared) → outer .zib-widget.padding-10 + each card class=padding-10 in .relative-h
* individual (default) → outer empty div + each card class=zib-widget in .flex1
* Row: .flex.jse.flex-row.gutters-5.flex-col-sm-2
*/
$show_widget_bg = ($card_bg_mode === 'shared');
$icon_radius4 = ($card_icon_shape === 'square');
$slider_card_html = '';
foreach ($icon_cards as $raw) {
if (!is_array($raw)) {
continue;
}
$card = $raw;
$card['class'] = $show_widget_bg ? 'padding-10' : 'zib-widget';
$extra = trim((string) ($card['icon_class'] ?? ''));
if ($icon_radius4 && !str_contains($extra, 'radius4')) {
$extra = trim($extra . ' radius4');
}
$card['icon_class'] = $extra;
unset($card['icon_shape']);
$wrap_class = $show_widget_bg ? 'relative-h' : 'flex1';
$inner = function_exists('aksrt_icon_cover_card')
? aksrt_icon_cover_card($card)
: (function_exists('aksrt_render_icon_cover_card') ? aksrt_render_icon_cover_card($card) : '');
if ($inner === '') {
continue;
}
$slider_card_html .= '<div class="' . esc_attr($wrap_class) . '">' . $inner . '</div>';
}
if ($slider_card_html === '') {
return;
}
?>
<div class="header-slider-card header-components-card container">
<div class="header-components-card__container container">
<?php if ($card_bg_mode === 'shared') : ?>
<div class="header-components-card__wrap header-components-card__wrap--shared">
<div class="header-components-card__row">
<?php foreach ($icon_cards as $card) : ?>
<?php $card['icon_shape'] = $card_icon_shape; ?>
<div class="header-components-card__item">
<?php echo aksrt_render_icon_cover_card($card); ?>
</div>
<?php endforeach; ?>
</div>
</div>
<?php else : ?>
<div class="header-components-card__row">
<?php foreach ($icon_cards as $card) : ?>
<?php $card['icon_shape'] = $card_icon_shape; ?>
<div class="header-components-card__item">
<div class="header-components-card__item-bg">
<?php echo aksrt_render_icon_cover_card($card); ?>
</div>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
<?php if ($show_widget_bg) : ?>
<div class="zib-widget padding-10">
<?php else : ?>
<div class="">
<?php endif; ?>
<div class="flex jse flex-row gutters-5 flex-col-sm-2">
<?php echo $slider_card_html; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
</div>
</div>
</div>
<?php
};