feat(widgets): IconCards + IconCoverCards via shared icon helpers
Rebuild vertical/horizontal icon card widgets on aksrt_icon_card and aksrt_icon_cover_card with row gutters and optional scroll animation.
This commit is contained in:
1 parent
89f2ca45c4
commit
a54bbee80b
2 files changed
+200
-101
No files matched your search
@@ -1,6 +1,6 @@
|
||||
<?php
|
||||
/**
|
||||
* Icon cover cards (zibll zib_widget_ui_icon_cover_card).
|
||||
* Icon cover cards (zibll zib_widget_ui_icon_cover_card → aksrt_icon_cover_card).
|
||||
*
|
||||
* @package AKSRT
|
||||
*/
|
||||
@@ -22,16 +22,21 @@ class WidgetIconCoverCards extends \WP_Widget {
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* @param array<string,mixed> $args
|
||||
* @param array<string,mixed> $instance
|
||||
*/
|
||||
public function widget($args, $instance): void {
|
||||
$cards = $this->normalize($instance['cards'] ?? []);
|
||||
if (!$cards) {
|
||||
return;
|
||||
}
|
||||
$cols = max(1, min(4, (int) ($instance['pc_row'] ?? 2)));
|
||||
$m_cols = max(1, min(2, (int) ($instance['m_row'] ?? 1)));
|
||||
$pc_row = max(1, min(4, (int) ($instance['pc_row'] ?? 2)));
|
||||
$m_row = max(1, min(2, (int) ($instance['m_row'] ?? 1)));
|
||||
$icon_size = max(16, min(48, (int) ($instance['icon_size'] ?? 25)));
|
||||
$radius = !empty($instance['icon_radius4']);
|
||||
$go_link = !empty($instance['go_link']);
|
||||
$show_bg = !empty($instance['show_widget_bg']);
|
||||
|
||||
echo $args['before_widget']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
|
||||
$title = apply_filters('widget_title', (string) ($instance['title'] ?? ''), $instance, $this->id_base);
|
||||
@@ -39,31 +44,49 @@ class WidgetIconCoverCards extends \WP_Widget {
|
||||
echo $args['before_title'] . esc_html($title) . $args['after_title']; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
|
||||
}
|
||||
|
||||
$style = sprintf('--aksrt-icc-pc:%d;--aksrt-icc-m:%d;--aksrt-icc-icon:%dpx;', $cols, $m_cols, $icon_size);
|
||||
echo '<div class="aksrt-icon-cover' . ($radius ? ' is-radius' : '') . '" style="' . esc_attr($style) . '">';
|
||||
$is_row = count($cards) > 1;
|
||||
$pc_span = max(1, (int) floor(12 / $pc_row));
|
||||
$m_span = max(1, (int) floor(12 / $m_row));
|
||||
$row_class = 'col-sm-' . $pc_span . ($m_row > 1 ? ' col-xs-' . $m_span : '');
|
||||
|
||||
echo $show_bg ? '<div class="zib-widget padding-10">' : '<div class="mb10">';
|
||||
if ($is_row) {
|
||||
echo '<div class="row gutters-5">';
|
||||
}
|
||||
|
||||
foreach ($cards as $card) {
|
||||
$url = $card['url'];
|
||||
$url = (string) ($card['url'] ?? '');
|
||||
if ($url !== '' && $go_link && function_exists('aksrt_go_link')) {
|
||||
$url = aksrt_go_link($url, true);
|
||||
}
|
||||
$tag = $url !== '' ? 'a' : 'div';
|
||||
$href = $url !== '' ? ' href="' . esc_url($url) . '"' . ($card['target'] !== '' ? ' target="' . esc_attr($card['target']) . '" rel="noopener noreferrer"' : '') : '';
|
||||
echo '<' . $tag . ' class="aksrt-icon-cover__item"' . $href . '>';
|
||||
echo '<div class="aksrt-icon-cover__icon">';
|
||||
if ($card['icon_image'] !== '') {
|
||||
echo '<img src="' . esc_url($card['icon_image']) . '" alt="" loading="lazy" />';
|
||||
} elseif ($card['icon'] !== '') {
|
||||
echo '<i class="' . esc_attr($card['icon']) . '" aria-hidden="true"></i>';
|
||||
$card_args = [
|
||||
'class' => $show_bg ? 'padding-10' : 'zib-widget mb10',
|
||||
'icon' => (string) ($card['icon'] ?? ''),
|
||||
'icon_image' => (string) ($card['icon_image'] ?? ''),
|
||||
'icon_size' => $icon_size,
|
||||
'icon_class' => $radius ? 'radius4' : '',
|
||||
'icon_color' => (string) ($card['icon_color'] ?? ''),
|
||||
'title' => (string) ($card['title'] ?? ''),
|
||||
'desc' => (string) ($card['desc'] ?? ''),
|
||||
'link' => [
|
||||
'url' => $url,
|
||||
'target' => (string) ($card['target'] ?? ''),
|
||||
],
|
||||
];
|
||||
|
||||
if ($is_row) {
|
||||
echo '<div class="' . esc_attr($row_class) . '">';
|
||||
}
|
||||
if (function_exists('aksrt_icon_cover_card')) {
|
||||
echo aksrt_icon_cover_card($card_args); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
|
||||
}
|
||||
if ($is_row) {
|
||||
echo '</div>';
|
||||
}
|
||||
}
|
||||
|
||||
if ($is_row) {
|
||||
echo '</div>';
|
||||
echo '<div class="aksrt-icon-cover__text">';
|
||||
if ($card['title'] !== '') {
|
||||
echo '<div class="aksrt-icon-cover__title">' . esc_html($card['title']) . '</div>';
|
||||
}
|
||||
if ($card['desc'] !== '') {
|
||||
echo '<div class="aksrt-icon-cover__desc">' . esc_html($card['desc']) . '</div>';
|
||||
}
|
||||
echo '</div></' . $tag . '>';
|
||||
}
|
||||
echo '</div>';
|
||||
|
||||
@@ -94,6 +117,7 @@ class WidgetIconCoverCards extends \WP_Widget {
|
||||
continue;
|
||||
}
|
||||
$url = '';
|
||||
$target = '';
|
||||
if (is_array($row['link'] ?? null)) {
|
||||
$url = esc_url_raw(trim((string) ($row['link']['url'] ?? '')));
|
||||
$target = sanitize_text_field((string) ($row['link']['target'] ?? ''));
|
||||
@@ -106,6 +130,7 @@ class WidgetIconCoverCards extends \WP_Widget {
|
||||
'desc' => sanitize_text_field((string) ($row['desc'] ?? '')),
|
||||
'icon' => $icon,
|
||||
'icon_image' => $icon_image,
|
||||
'icon_color' => sanitize_html_class((string) ($row['icon_color'] ?? '')),
|
||||
'url' => $url,
|
||||
'target' => $target,
|
||||
];
|
||||
@@ -116,6 +141,9 @@ class WidgetIconCoverCards extends \WP_Widget {
|
||||
return $out;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param array<string,mixed> $instance
|
||||
*/
|
||||
public function form($instance): void {
|
||||
$json = is_string($instance['cards'] ?? null)
|
||||
? (string) $instance['cards']
|
||||
@@ -144,20 +172,27 @@ class WidgetIconCoverCards extends \WP_Widget {
|
||||
</p>
|
||||
<p>
|
||||
<label><input type="checkbox" name="<?php echo esc_attr($this->get_field_name('icon_radius4')); ?>" value="1" <?php checked(!empty($instance['icon_radius4'])); ?>> <?php esc_html_e('图标圆角方形', 'aksrt'); ?></label><br>
|
||||
<label><input type="checkbox" name="<?php echo esc_attr($this->get_field_name('show_widget_bg')); ?>" value="1" <?php checked(!empty($instance['show_widget_bg'])); ?>> <?php esc_html_e('模块背景', 'aksrt'); ?></label><br>
|
||||
<label><input type="checkbox" name="<?php echo esc_attr($this->get_field_name('go_link')); ?>" value="1" <?php checked(!empty($instance['go_link'])); ?>> <?php esc_html_e('外链跳转页', 'aksrt'); ?></label>
|
||||
</p>
|
||||
<?php
|
||||
}
|
||||
|
||||
/**
|
||||
* @param array<string,mixed> $new_instance
|
||||
* @param array<string,mixed> $old_instance
|
||||
* @return array<string,mixed>
|
||||
*/
|
||||
public function update($new_instance, $old_instance): array {
|
||||
return [
|
||||
'title' => sanitize_text_field((string) ($new_instance['title'] ?? '')),
|
||||
'cards' => $this->normalize($new_instance['cards'] ?? []),
|
||||
'pc_row' => max(1, min(4, (int) ($new_instance['pc_row'] ?? 2))),
|
||||
'm_row' => max(1, min(2, (int) ($new_instance['m_row'] ?? 1))),
|
||||
'icon_size' => max(16, min(48, (int) ($new_instance['icon_size'] ?? 25))),
|
||||
'icon_radius4' => !empty($new_instance['icon_radius4']) ? 1 : 0,
|
||||
'go_link' => !empty($new_instance['go_link']) ? 1 : 0,
|
||||
'title' => sanitize_text_field((string) ($new_instance['title'] ?? '')),
|
||||
'cards' => $this->normalize($new_instance['cards'] ?? []),
|
||||
'pc_row' => max(1, min(4, (int) ($new_instance['pc_row'] ?? 2))),
|
||||
'm_row' => max(1, min(2, (int) ($new_instance['m_row'] ?? 1))),
|
||||
'icon_size' => max(16, min(48, (int) ($new_instance['icon_size'] ?? 25))),
|
||||
'icon_radius4' => !empty($new_instance['icon_radius4']) ? 1 : 0,
|
||||
'show_widget_bg' => !empty($new_instance['show_widget_bg']) ? 1 : 0,
|
||||
'go_link' => !empty($new_instance['go_link']) ? 1 : 0,
|
||||
];
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user