mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-09-04 07:19:52 +00:00
fix(studio): prevent NLE timeline scrollbar from clipping below viewport (#481)
* fix(studio): restore flex layout inside the NLE timeline panel Without `flex flex-col`, the toolbar and Timeline children render as block elements and Timeline's `h-full` takes the panel's entire height. The toolbar still occupies its own ~45px of flow, pushing the scroll area below the viewport and clipping the scrollbar at the bottom of the right-side panel. * fix(studio): pin toolbar height with flex-shrink-0 and trim comment Wrap the toolbar slot in a flex-shrink-0 div so Timeline back-pressure can't squeeze the toolbar below its natural height. The visible bug doesn't manifest at current sizes, but in a flex-col container both children are flex items and the toolbar has no shrink guard of its own. Trim the inline comment to a single line — the rationale belongs in the commit message, not at the call site.
This commit is contained in:
@@ -392,7 +392,8 @@ export const NLELayout = memo(function NLELayout({
|
||||
<div className="flex flex-col flex-shrink-0" style={{ height: timelineH }}>
|
||||
{/* Timeline tracks */}
|
||||
<div
|
||||
className="flex-1 min-h-0 overflow-hidden bg-neutral-950"
|
||||
// flex-col: toolbar takes natural height, Timeline fills remainder.
|
||||
className="flex flex-col flex-1 min-h-0 overflow-hidden bg-neutral-950"
|
||||
onDoubleClick={(e) => {
|
||||
if ((e.target as HTMLElement).closest("[data-clip]")) return;
|
||||
if (compositionStack.length > 1) {
|
||||
@@ -400,7 +401,7 @@ export const NLELayout = memo(function NLELayout({
|
||||
}
|
||||
}}
|
||||
>
|
||||
{timelineToolbar}
|
||||
<div className="flex-shrink-0">{timelineToolbar}</div>
|
||||
<Timeline
|
||||
onSeek={seek}
|
||||
onDrillDown={handleDrillDown}
|
||||
|
||||
Reference in New Issue
Block a user