fix(canvas): 分镜脚本节点 - 表头与行区共享同宽滚动条 gutter 对齐列线 (#173)

Co-authored-by: zhaoyue <zhaoyue@rongshantech.com>
This commit is contained in:
爱笑的毛毛虫
2026-08-07 18:54:26 +08:00
committed by GitHub
parent 06807ebfa3
commit dbd5fb2de4
2 changed files with 10 additions and 1 deletions

View File

@@ -173,7 +173,7 @@ export function CanvasScriptNodeContent({ node, batch, pipeline, scale, mentionR
<GenerationBatchDetails batch={batch} rows={rows} onRetryItem={(itemId) => onRetryBatchItem(batch.id, itemId)} onCancelItem={(itemId) => onCancelBatchItem(batch.id, itemId)} />
</Modal> : null}
<StoryboardMiniPipeline pipeline={pipeline} theme={theme} rows={rows} />
<div className="grid h-9 shrink-0 items-center border-b text-xs font-semibold" style={{ borderColor: theme.node.stroke, color: theme.node.muted, gridTemplateColumns: SCRIPT_GRID_TEMPLATE }}>
<div className="storyboard-header-gutter grid h-9 shrink-0 items-center border-b text-xs font-semibold" style={{ borderColor: theme.node.stroke, color: theme.node.muted, gridTemplateColumns: SCRIPT_GRID_TEMPLATE }}>
<HeaderCell borderColor={theme.node.stroke} align="center">序号</HeaderCell>
<HeaderCell borderColor={theme.node.stroke} align="center">时长</HeaderCell>
<HeaderCell borderColor={theme.node.stroke}>画面描述</HeaderCell>

View File

@@ -4715,6 +4715,15 @@
scrollbar-width: auto;
}
/* 表头与滚动行区共享同宽 scrollbar gutter,保证列线对齐;滚动条本身透明隐藏 */
.storyboard-header-gutter {
overflow-x: hidden;
overflow-y: scroll;
scrollbar-color: transparent transparent;
scrollbar-gutter: stable;
scrollbar-width: auto;
}
.storyboard-scrollbar::-webkit-scrollbar {
width: 12px;
}