Moved the playbeam to the overlay decoration layer.

Signed-off-by: Mike Lischke <mike@lischke-online.de>

Author: mike-lischke

src/App.scss

@@ -219,7 +219,8 @@ h6 {
     margin: 8px 0;
 }
 
-#trackViewerDecorations {
+#trackViewerDecorations,
+#trackViewerDecorationOverlay {
     position: absolute;
     flex-grow: 1;
 
@@ -230,8 +231,8 @@ h6 {
 
     pointer-events: none;
 
-    background-image: linear-gradient(to right, var(--color-base-100) 3px, transparent 1px);
-    background-size: calc(16 * var(--note-height)) 100%;
+    background-image: linear-gradient(to right, var(--color-neutral) 3px, transparent 1px);
+    background-size: calc(16 * (var(--note-height) + 4px)) 100%;
 }
 
 #playBeam {
@@ -291,7 +292,6 @@ h6 {
 }
 
 .guiderail {
-    margin-left: calc(var(--track-meta-width) + 1.5pt);
     height: 20pt;
 }
 

src/components/ui/Arrangement/ArrangementViewer.tsx

@@ -187,7 +187,6 @@ export class ArrangementViewer extends UIComponent<IArrangementViewerProps, IArr
                                     crossAlignment={ChildAlignment.Stretch}
                                 >
                                     <div id="playRange" ref={this.playRangeRef} />
-                                    <div id="playBeam" ref={this.playBeamRef} />
                                 </Container>
                                 <GuideRail arrangementView={arrangement} />
                                 {
@@ -207,9 +206,8 @@ export class ArrangementViewer extends UIComponent<IArrangementViewerProps, IArr
                                         );
                                     })
                                 }
-                                <Container
-                                    id="trackViewerSelectionOverlay"
-                                >
+                                <Container id="trackViewerDecorationOverlay" >
+                                    <div id="playBeam" ref={this.playBeamRef} />
                                 </Container>
                             </Container>
                         </Container>