CopyBot/mediacms
1
0
Fork 0
mirror of https://github.com/mediacms-io/mediacms.git synced 2025-11-07 07:58:53 -05:00
Code Issues Packages Projects Releases Wiki Activity

Ensure remaining time is always visible in VideoJS

Browse Source 
Updated CSS to force .custom-remaining-time and .vjs-remaining-time elements to be visible and displayed as flex on all screen sizes. This ensures the remaining time display is consistently shown regardless of responsive layout or device.
This commit is contained in:
Yiannis Christodoulou 2025-10-10 01:56:06 +03:00
parent 115af7497b
commit 73a89c72df
1 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
frontend-tools/video-js/src/VideoJS.css
View File

@ -469,6 +469,15 @@ html {
font-weight: 500 !important;
}
/* Force CustomRemainingTime to always be visible on all screen sizes */
.video-js .custom-remaining-time,
.video-js .vjs-remaining-time {
display: flex !important;
visibility: visible !important;
opacity: 1 !important;
flex-shrink: 0 !important;
}
@media (hover: hover) and (pointer: fine) {
.vjs-volume-control.vjs-control {
top: 17px !important;
@ -1045,7 +1054,8 @@ button.vjs-button > .vjs-icon-placeholder:before {
}
/* Ensure time display is visible and has priority */
.video-js .custom-remaining-time {
.video-js .custom-remaining-time,
.video-js .vjs-remaining-time {
display: flex !important;
visibility: visible !important;
opacity: 1 !important;
@ -1053,7 +1063,8 @@ button.vjs-button > .vjs-icon-placeholder:before {
min-width: fit-content !important;
}
.video-js .custom-remaining-time .vjs-remaining-time-display {
.video-js .custom-remaining-time .vjs-remaining-time-display,
.video-js .vjs-remaining-time .vjs-remaining-time-display {
display: flex !important;
visibility: visible !important;
opacity: 1 !important;