fix(single): align slide and video cover heights with image cover
The image-mode cover reserves +50px for the title/breadcrumb overlay (calc(scale% + 50px)), but the slide cover wrapper was given a bare inline padding-bottom by aksrt_render_slider, permanently defeating the .cover-slide rule, and the video cover used a bare video_scale%. - aksrt_render_slider: add scale_extra so scale mode emits calc(ratio% + extra); the single cover passes 50px so all three modes share one height formula - drop the unreachable static slide fallback and function_exists guard (the helper is unconditionally loaded by inc/bootstrap.php), the always-true cover_url/ep_count conditions, and the dead --scale-ratio and inner swiper padding emitted in scale mode - remove the dead cover CSS cluster with no producer: .single-cover-slide (main.css/main.min.css/cover.css), .single-cover-slider family (components/base.css), .single-cover-slide-wrap and .single-cover__* helpers (cover.css), and initSlideCovers in misc.js - rebuild public bundles via tools/build-public-assets.mjs - add single-cover-height-contract test covering the shared formula and the dead-code removals
This commit is contained in:
1 parent
05a6b6fc54
commit
4f2d17f6ee
12 files changed
+133
-418
No files matched your search
@@ -27,6 +27,7 @@ defined('ABSPATH') || exit;
|
||||
* @type string $m_height 移动端高度 CSS 值 (默认 auto)
|
||||
* @type bool $scale_height 是否使用比例高度 (默认 false)
|
||||
* @type float $scale_ratio 比例值 (默认 0.45 = 45%)
|
||||
* @type string $scale_extra 比例高度附加量,如 '50px'(用于封面标题预留,默认空)
|
||||
* @type string $wrapper_class 额外 wrapper 类
|
||||
* @type string $slider_class 额外 slider 类
|
||||
* @type bool $show_nav 是否显示导航箭头 (默认 true)
|
||||
@@ -61,6 +62,7 @@ function aksrt_render_slider(array $args = []): string {
|
||||
'm_height' => 'auto',
|
||||
'scale_height' => false,
|
||||
'scale_ratio' => 0.45,
|
||||
'scale_extra' => '',
|
||||
'wrapper_class' => '',
|
||||
'slider_class' => '',
|
||||
'show_nav' => true,
|
||||
@@ -91,14 +93,16 @@ function aksrt_render_slider(array $args = []): string {
|
||||
|
||||
// 高度样式
|
||||
$height_style = '';
|
||||
$scale_padding = '';
|
||||
if ($args['scale_height']) {
|
||||
// padding-bottom percentage for ratio box (legacy graphic cover style).
|
||||
// 内层 .new-swiper 为绝对定位铺满 wrapper,高度完全由 wrapper 的 padding-bottom 决定。
|
||||
$ratio_pct = max(10, min(100, (float) $args['scale_ratio'] * 100));
|
||||
$height_style = sprintf(
|
||||
'--pc-height:auto;--m-height:auto;--scale-ratio:%s;padding-bottom:%s%%;',
|
||||
esc_attr((string) $args['scale_ratio']),
|
||||
esc_attr((string) $ratio_pct)
|
||||
);
|
||||
$scale_padding = $ratio_pct . '%';
|
||||
$scale_extra = trim((string) $args['scale_extra']);
|
||||
if ($scale_extra !== '') {
|
||||
$scale_padding = 'calc(' . $scale_padding . ' + ' . $scale_extra . ')';
|
||||
}
|
||||
} else {
|
||||
$height_style = sprintf('--pc-height:%s;--m-height:%s;', esc_attr($args['pc_height']), esc_attr($args['m_height']));
|
||||
}
|
||||
@@ -115,8 +119,8 @@ function aksrt_render_slider(array $args = []): string {
|
||||
$wrapper_class_str = implode(' ', $wrapper_classes);
|
||||
|
||||
// 渲染 HTML
|
||||
$html = '<div class="' . esc_attr($wrapper_class_str) . '"' . ($args['scale_height'] ? ' style="position:relative;' . esc_attr(sprintf('padding-bottom:%s%%;', (string) max(10, min(100, (float) $args['scale_ratio'] * 100)))) . '"' : '') . '>';
|
||||
$html .= '<div class="' . esc_attr($slider_class_str) . '" ' . implode(' ', $data_attrs) . ' style="' . esc_attr($height_style) . ($args['scale_height'] ? 'position:absolute;inset:0;width:100%;height:100%;' : '') . '">';
|
||||
$html = '<div class="' . esc_attr($wrapper_class_str) . '"' . ($args['scale_height'] ? ' style="position:relative;padding-bottom:' . esc_attr($scale_padding) . ';"' : '') . '>';
|
||||
$html .= '<div class="' . esc_attr($slider_class_str) . '" ' . implode(' ', $data_attrs) . ($args['scale_height'] ? ' style="position:absolute;inset:0;width:100%;height:100%;"' : ' style="' . esc_attr($height_style) . '"') . '>';
|
||||
$html .= '<div class="swiper-wrapper">';
|
||||
|
||||
foreach ($slides as $slide) {
|
||||
|
||||
Reference in new issue
Block a user