From c555ce8797132f7ca6f9be1d4d62a5ac81800077 Mon Sep 17 00:00:00 2001
From: Mikael Finstad <finstaden@gmail.com>
Date: Thu, 13 Mar 2025 21:59:08 +0900
Subject: [PATCH] put "between segments" behind markers

---
 src/renderer/src/Timeline.tsx | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/renderer/src/Timeline.tsx b/src/renderer/src/Timeline.tsx
index be771251..c5342b75 100644
--- a/src/renderer/src/Timeline.tsx
+++ b/src/renderer/src/Timeline.tsx
@@ -396,6 +396,16 @@ function Timeline({
           style={{ height: timelineHeight, width: `${zoom * 100}%`, position: 'relative', backgroundColor: timelineBackground, transition: darkModeTransition }}
           ref={timelineWrapperRef}
         >
+          {inverseCutSegments.map((seg) => (
+            <BetweenSegments
+              key={seg.segId}
+              start={seg.start}
+              end={seg.end}
+              fileDurationNonZero={fileDurationNonZero}
+              invertCutSegments={invertCutSegments}
+            />
+          ))}
+
           {cutSegments.map((seg, i) => {
             const selected = invertCutSegments || isSegmentSelected({ segId: seg.segId });
 
@@ -414,16 +424,6 @@ function Timeline({
             );
           })}
 
-          {inverseCutSegments.map((seg) => (
-            <BetweenSegments
-              key={seg.segId}
-              start={seg.start}
-              end={seg.end}
-              fileDurationNonZero={fileDurationNonZero}
-              invertCutSegments={invertCutSegments}
-            />
-          ))}
-
           {shouldShowKeyframes && !areKeyframesTooClose && keyFramesInZoomWindow.map((f) => (
             <div key={f.time} style={{ position: 'absolute', top: 0, bottom: 0, left: `${(f.time / fileDurationNonZero) * 100}%`, marginLeft: -1, width: 1, background: 'var(--gray11)', pointerEvents: 'none' }} />
           ))}