fix(single): match the reference video cover height (bare ratio)

Zibll reserves +50px only for covers whose title overlays them
(image/slide via .single-cover/.single-cover-slide); the video cover
keeps its title in the footer below and uses the bare scale height
(.dplayer-scale-height). Drop the +50px from the video box, pin the
reference height matrix in the contract test, and refresh the stale
slide-action assertion in the toast contract.
This commit is contained in:
2026-09-06 11:12:13 +08:00
parent 7c0d5945ca
commit d3eef19b95
3 changed files with 19 additions and 12 deletions
+4 -1
View File
@@ -28,10 +28,13 @@ if (!function_exists('aksrt_single_render_cover')) :
$title_html = (string) ($ctx['title_html'] ?? esc_html(get_the_title()));
if ($type === 'video') :
// 视频封面高度为裸比例(对齐参考主题 .dplayer-scale-height 契约):
// 标题/面包屑在下方 .single-video-footer,不叠加封面,无 +50px 补偿;
// 单图/多图封面标题叠加封面,才需要 calc(scale% + 50px)。
?>
<div class="single-head-cover">
<div class="single-video">
<div class="graphic single-cover single-cover--video imgbox-container" style="padding-bottom:calc(<?php echo esc_attr((string) $video_scale); ?>% + 50px);">
<div class="graphic single-cover single-cover--video imgbox-container" style="padding-bottom:<?php echo esc_attr((string) $video_scale); ?>%;">
<div class="aksrt-video single-cover__player" data-aksrt-video data-src="<?php echo esc_url($ctx['cover_url']); ?>"<?php echo $poster !== '' ? ' data-poster="' . esc_url($poster) . '"' : ''; ?> style="position:absolute;inset:0;width:100%;height:100%;"></div>
</div>
<div class="single-video-footer dplayer-featured">
@@ -1,7 +1,9 @@
'use strict';
// 文章详情页顶部封面高度契约:单图 / 多图(轮播) / 视频三种模式
// 必须共用同一高度公式 padding-bottom: calc(比例% + 50px)。
// 文章详情页顶部封面高度契约(对齐参考主题):
// 单图/多图(轮播)封面标题叠加封面,高度 = calc(比例% + 50px)(zibll .single-cover /
// .single-cover-slide);视频封面标题在下方 footer、无叠加,高度 = 裸比例%
// (zibll .dplayer-scale-height)。
const assert = require('node:assert/strict');
const fs = require('node:fs');
@@ -22,17 +24,18 @@ test('single cover: image mode keeps the calc(scale% + 50px) height', () => {
);
});
test('single cover: video mode aligns with the image-mode height formula', () => {
test('single cover: video mode uses the bare ratio height like the reference dplayer box', () => {
assert.match(
singleRender,
/single-cover--video imgbox-container" style="padding-bottom:calc\(<\?php echo esc_attr\(\(string\) \$video_scale\); \?>% \+ 50px\);"/,
'视频封面必须输出 calc(video_scale% + 50px) 内联高度'
/single-cover--video imgbox-container" style="padding-bottom:<\?php echo esc_attr\(\(string\) \$video_scale\); \?>%;"/,
'视频封面必须输出裸 video_scale% 高度(标题在下方 footer,无叠加补偿)'
);
// 不得回退到裸比例高度。
// +50px 是标题叠加封面的补偿量,仅单图/多图封面适用;视频封面
// 对齐参考主题 .dplayer-scale-height,不得继承该公式。
assert.doesNotMatch(
singleRender,
/padding-bottom:<\?php echo esc_attr\(\(string\) \$video_scale\); \?>%;"/,
'视频封面禁止输出不带 +50px 的裸比例高度'
/single-cover--video imgbox-container" style="padding-bottom:calc\(/,
'视频封面禁止输出 +50px 叠加补偿高度'
);
});
+4 -3
View File
@@ -388,9 +388,10 @@ test('front submit actions use direct fixed-id notyf flows', () => {
assert.match(submit, /submit: function[\s\S]*?notyf\([^;]+?'load'[^;]+?toastId[\s\S]*?notyf\([^;]+?'success'[^;]+?toastId[\s\S]*?notyf\([^;]+?'danger'[^;]+?toastId/);
assert.match(submit, /bindDraftDelete: function[\s\S]*?'aksrt-front-submit-delete-draft-toast'[\s\S]*?'load'[\s\S]*?'success'[\s\S]*?'danger'/);
// 封面(单图/多图/视频封面)选择统一走 AksrtSubmitMedia 选择器,
// 上传中的 load/success/danger 通知由选择器以固定 id 独立承载。
['image', 'slide', 'video'].forEach((type) => {
// 封面(单图/多图共用 image 入口、视频封面、视频)选择统一走
// AksrtSubmitMedia 选择器,上传中的 load/success/danger 通知由选择器
// 以固定 id 独立承载;幻灯片动作已并入 image 多选,无独立分支。
['image', 'video_pic', 'video'].forEach((type) => {
assert.match(submit, new RegExp("act === '" + type + "'[\\s\\S]{0,400}?self\\.openMediaPicker\\("));
});
assert.match(editor, /var toastId = 'aksrt-front-submit-editor-media-toast';/);