CopyBot/mediacms
1
0
Fork 0
mirror of https://github.com/mediacms-io/mediacms.git synced 2026-02-10 01:13:01 -05:00
Code Issues Packages Projects Releases Wiki Activity

feat: Major Upgrade to Video.js v8 — Chapters Functionality, Fixes and Improvements

Browse Source
This commit is contained in:
Yiannis Christodoulou
2025-10-20 15:30:00 +03:00
committed by GitHub
parent b39072c8ae
commit a5e6e7b9ca
362 changed files with 62326 additions and 238721 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
frontend-tools/video-js/src/styles/embed.css Normal file
View File

@@ -0,0 +1,95 @@
/* ===== EMBED PLAYER STYLES ===== */
/* YouTube-style embed player with fullscreen poster */
/* Fullscreen poster image - fills entire iframe */
#page-embed .video-js-root-embed .video-js .vjs-poster {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
border-radius: 0 !important;
/* z-index: 1 !important; */
display: block !important;
background-size: contain !important;
background-position: center !important;
background-repeat: no-repeat !important;
background-color: #000 !important;
}
/* Keep poster visible even when playing for audio files */
#page-embed .video-js-root-embed .video-js.vjs-audio-type .vjs-poster,
#page-embed .video-js-root-embed .video-js.vjs-audio-poster-mode .vjs-poster,
#page-embed .video-js-root-embed .video-js.vjs-has-started.vjs-audio-type .vjs-poster,
#page-embed .video-js-root-embed .video-js.vjs-playing.vjs-audio-type .vjs-poster {
display: block !important;
opacity: 1 !important;
visibility: visible !important;
}
/* Fullscreen video element - maintain aspect ratio */
#page-embed .video-js-root-embed .video-js video {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
border-radius: 0 !important;
background-color: #000 !important;
}
/* Fullscreen video player container */
#page-embed .video-js-root-embed .video-js {
width: 100% !important;
height: 100% !important;
position: relative !important;
border-radius: 0 !important;
}
/* Root embed container */
#page-embed .video-js-root-embed {
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
}
/* Page embed container */
#page-embed {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
/* Big play button - only show when video hasn't started */
#page-embed .video-js-root-embed .video-js:not(.vjs-has-started) .vjs-big-play-button {
position: absolute !important;
top: 50% !important;
left: 50% !important;
/* transform: translate(-50%, -50%) !important; */
z-index: 10 !important;
display: block !important;
visibility: visible !important;
opacity: 1 !important;
}
/* Hide big play button after video has started */
#page-embed .video-js-root-embed .video-js.vjs-has-started .vjs-big-play-button {
display: none !important;
opacity: 0 !important;
visibility: hidden !important;
}
/* ===== EMBED CONTROL BAR POSITIONING ===== */
/* Sticky controls for embed player - always at bottom of window */
/* #page-embed .video-js-root-embed .video-js .vjs-control-bar {
position: fixed !important;
bottom: 0 !important;
left: 0 !important;
right: 0 !important;
}
*/