From 499d98a5b26f8d813782a2dce998082d49413ad8 Mon Sep 17 00:00:00 2001 From: Yiannis Christodoulou Date: Fri, 19 Sep 2025 12:44:17 +0300 Subject: [PATCH] fix: Fullscreen video styles for embedded video player --- frontend-tools/video-js/index-embed.html | 4 +++- frontend-tools/video-js/src/VideoJS.css | 18 ++++++------------ .../js/components/VideoJS/VideoJSEmbed.jsx | 3 ++- 3 files changed, 11 insertions(+), 14 deletions(-) diff --git a/frontend-tools/video-js/index-embed.html b/frontend-tools/video-js/index-embed.html index 0d926325..f5e9c3b5 100644 --- a/frontend-tools/video-js/index-embed.html +++ b/frontend-tools/video-js/index-embed.html @@ -8,7 +8,9 @@ -
+
+
+
diff --git a/frontend-tools/video-js/src/VideoJS.css b/frontend-tools/video-js/src/VideoJS.css index 115e52c8..7ebee252 100644 --- a/frontend-tools/video-js/src/VideoJS.css +++ b/frontend-tools/video-js/src/VideoJS.css @@ -23,13 +23,13 @@ html { } /* Fullscreen video styles for embedded video player */ -.video-js-root-embed .video-js video { +#page-embed .video-js-root-embed .video-js video { width: 100vw !important; height: 100vh !important; object-fit: cover !important; border-radius: 0 !important; } -.video-js-root-embed .video-js .vjs-poster { +#page-embed .video-js-root-embed .video-js .vjs-poster { border-radius: 0 !important; width: 100vw !important; height: 100vh !important; @@ -57,7 +57,7 @@ html { } /* Fullscreen styles for embedded video player */ -.video-js-root-embed .video-container { +#page-embed .video-js-root-embed .video-container { width: 100vw; height: 100vh; max-width: none; @@ -75,7 +75,7 @@ html { } /* Fullscreen fluid styles for embedded video player */ -.video-js-root-embed .video-js.vjs-fluid { +#page-embed .video-js-root-embed .video-js.vjs-fluid { width: 100vw !important; height: 100vh !important; max-width: none !important; @@ -785,7 +785,7 @@ button { } /* Fullscreen video-js player styles for embedded video player */ -.video-js-root-embed .video-js { +#page-embed .video-js-root-embed .video-js { width: 100vw !important; height: 100vh !important; border-radius: 0; @@ -793,7 +793,7 @@ button { } /* Prevent page scrolling when embed is active */ -.video-js-root-embed { +#page-embed .video-js-root-embed { position: fixed; top: 0; left: 0; @@ -803,12 +803,6 @@ button { background: #000; } -html.video-js-root-embed-active, -body.video-js-root-embed-active { - margin: 0; - padding: 0; - overflow: hidden; -} .video-chapter { position: absolute; top: auto; diff --git a/frontend/src/static/js/components/VideoJS/VideoJSEmbed.jsx b/frontend/src/static/js/components/VideoJS/VideoJSEmbed.jsx index 7021fcf4..dbecb0e0 100644 --- a/frontend/src/static/js/components/VideoJS/VideoJSEmbed.jsx +++ b/frontend/src/static/js/components/VideoJS/VideoJSEmbed.jsx @@ -214,7 +214,8 @@ const VideoJSEmbed = ({ return (
- {inEmbed ?
:
} + des an einai mesa sto modal i sto embed page prota + {/* {inEmbed ?
:
} */}
); };