From b4a2f31520b69b31fa5aeb20dc18011e0f385bdd Mon Sep 17 00:00:00 2001
From: Ajay Ramachandran <dev@ajay.app>
Date: Sat, 30 Oct 2021 21:48:52 -0400
Subject: [PATCH] Render preview bar behind scrubber

---
 public/content.css              | 2 +-
 src/content.ts                  | 2 +-
 src/js-components/previewBar.ts | 8 +++++---
 3 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/public/content.css b/public/content.css
index ebda9024..108b4dda 100644
--- a/public/content.css
+++ b/public/content.css
@@ -8,7 +8,7 @@
 	
 	height: 100%;
 	transform: scaleY(0.6) translateY(-30%) translateY(1.5px);
-	z-index: 40;
+	z-index: 42;
 
 	transition: transform .1s cubic-bezier(0,0,0.2,1);
 }
diff --git a/src/content.ts b/src/content.ts
index 7a6c2334..8c9e240a 100644
--- a/src/content.ts
+++ b/src/content.ts
@@ -366,7 +366,7 @@ function createPreviewBar(): void {
         // For mobile YouTube
         ".progress-bar-background",
         // For YouTube
-        ".ytp-progress-bar-container",
+        ".ytp-progress-bar",
         ".no-model.cue-range-markers",
         // For Invidious/VideoJS
         ".vjs-progress-holder"
diff --git a/src/js-components/previewBar.ts b/src/js-components/previewBar.ts
index eb241ff2..ea00f832 100644
--- a/src/js-components/previewBar.ts
+++ b/src/js-components/previewBar.ts
@@ -158,8 +158,6 @@ class PreviewBar {
             this.parent.addEventListener("mouseleave", () => this.container.classList.remove("hovered"));
         }
 
-        
-
         // On the seek bar
         this.parent.prepend(this.container);
     }
@@ -323,7 +321,11 @@ class PreviewBar {
         }
 
         originalSectionClone.remove();
-        progressBar.prepend(newChapterBar);
+        if (this.container?.parentElement === progressBar) {
+            progressBar.insertBefore(newChapterBar, this.container.nextSibling);
+        } else {
+            progressBar.prepend(newChapterBar);
+        }
         
         // Hide old bar
         chapterBar.style.display = "none";