let's see how cursor does with our problem

skillrecordings · Oct 28, 2024 · 0dbd097 · 0dbd097
1 parent 4d1f4cb
commit 0dbd097
Showing 1 changed file with 12 additions and 3 deletions.
diff --git a/src/app/(content)/lessons/[slug]/embed/_components/embed-lesson.css b/src/app/(content)/lessons/[slug]/embed/_components/embed-lesson.css
@@ -1,11 +1,20 @@
 .cueplayer-react .cueplayer-react-video-wrapper {
-  display: flex;
-  justify-content: center;
+  position: relative;
+  padding-top: 56.25%; /* 16:9 aspect ratio (9/16 = 0.5625) */
   width: 100%;
-  height: 100%;
+  height: 0; /* Height is controlled by padding */
   max-width: 100vw;
 }
 
+/* Position video element absolutely within the wrapper */
+.cueplayer-react .cueplayer-react-video-wrapper video {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
 .cueplayer-react-controls-holder {
   width: 100%;
   margin: 0 auto;