fix: enlarge filmstrip hover near waveform

This commit is contained in:
2026-05-19 18:06:17 +08:00
parent 97016dcc0f
commit 818d785d14
3 changed files with 10 additions and 10 deletions

View File

@@ -15,7 +15,7 @@
## 部署事实
- 平台VPS `76.13.31.179`Ubuntu 24.04 / Docker Compose / Coolify Traefik
- 发布状态已部署并验证2026-05-19逐句时间轴窄版面板 + 波形同框时间对齐画面胶片 + 胶片原位放大 + 隐藏源视频工作区音频解析摘要卡 + 隐藏工作区顶部状态提示条 + 三字段候选生成工作流 + 折叠紧凑候选区);`https://marketing.skg.com` 已启用应用内登录页,未登录 API 返回 401认证后首页 200容器内 `/health` 返回 `ok:true`
- 发布状态已部署并验证2026-05-19逐句时间轴窄版面板 + 波形同框时间对齐画面胶片 + 胶片贴近波形并原位放大 + 隐藏源视频工作区音频解析摘要卡 + 隐藏工作区顶部状态提示条 + 三字段候选生成工作流 + 折叠紧凑候选区);`https://marketing.skg.com` 已启用应用内登录页,未登录 API 返回 401认证后首页 200容器内 `/health` 返回 `ok:true`
- 主站 / 前端:`https://marketing.skg.com`
- API / 后端:`https://marketing.skg.com/api`
- 代码仓库 / Gitea`https://git.kang-kang.com/kangwan/20260512-skg-tk`

File diff suppressed because one or more lines are too long

View File

@@ -2740,8 +2740,8 @@ function TimelineFilmstrip({
const hoverPct = hoverTime === null ? null : clampNumber((hoverTime / Math.max(duration, 1)) * 100, 0, 100)
return (
<div className="relative z-20 mt-2 overflow-visible pt-1">
<div className="mb-1.5 flex items-center justify-between gap-3">
<div className="relative z-30 mt-1 overflow-visible pt-0.5">
<div className="mb-0.5 flex items-center justify-between gap-3">
<div className="min-w-0" />
<div className="flex shrink-0 items-center gap-1">
{FILMSTRIP_DENSITIES.map((item) => (
@@ -2763,7 +2763,7 @@ function TimelineFilmstrip({
</div>
</div>
<div className="relative h-[202px] overflow-visible border-t border-white/8">
<div className="relative h-[172px] overflow-visible border-t border-white/8">
{status === "loading" ? (
<div className="absolute inset-x-0 top-12 flex h-[72px] items-center justify-center gap-2 rounded-md border border-dashed border-white/12 text-[11px] text-white/40">
<Loader2 className="h-3.5 w-3.5 animate-spin" />
@@ -2774,8 +2774,8 @@ function TimelineFilmstrip({
</div>
) : frames.length ? (
<div className="absolute bottom-7 left-0 right-0 top-4 overflow-visible">
<div className="absolute inset-x-0 bottom-[20px] h-px bg-white/14" />
<div className="absolute bottom-7 left-0 right-0 top-1 overflow-visible">
<div className="absolute inset-x-0 bottom-[58px] h-px bg-white/14" />
{hoverPct !== null && (
<div
className="pointer-events-none absolute bottom-0 top-0 z-10 w-px bg-cyan-100/55"
@@ -2802,7 +2802,7 @@ function TimelineFilmstrip({
onDragStart(frame.time)
}}
onDragEnd={onDragEnd}
className={`absolute bottom-[20px] z-20 -translate-x-1/2 ${tiltClass} origin-bottom cursor-grab transition-transform duration-150 hover:z-50 hover:-translate-y-3 hover:rotate-0 hover:scale-[2.45] active:cursor-grabbing`}
className={`absolute bottom-[58px] z-20 -translate-x-1/2 ${tiltClass} origin-bottom cursor-grab transition-transform duration-150 hover:z-[90] hover:-translate-y-3 hover:rotate-0 hover:scale-[4.8] active:cursor-grabbing`}
style={{ left: `${framePct}%` }}
title={`${frame.time.toFixed(1)}s · 拖到关键帧库才选取`}
>