CDN/mediacms
3
0
Fork 0
mirror of https://github.com/mediacms-io/mediacms.git synced 2025-10-06 22:32:41 +07:00
Code Issues Packages Projects Releases Wiki Activity

fix: During segments playback mode, disable button interactions but keep hover working

Browse Source
This commit is contained in:
Yiannis Christodoulou
2025-06-24 17:20:41 +03:00
parent add6f6a704
commit 9b564121d5
4 changed files with 32 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend-tools/video-editor/client/src/styles/TimelineControls.css
+12 -12
View File
@@ -612,9 +612,7 @@
white-space: nowrap;
opacity: 0;
visibility: hidden;
transition:
opacity 0.2s,
visibility 0.2s;
transition: opacity 0.2s, visibility 0.2s;
z-index: 1000;
pointer-events: none;
}
@@ -630,9 +628,7 @@
border-color: rgba(0, 0, 0, 0.8) transparent transparent transparent;
opacity: 0;
visibility: hidden;
transition:
opacity 0.2s,
visibility 0.2s;
transition: opacity 0.2s, visibility 0.2s;
pointer-events: none;
}
@@ -839,14 +835,18 @@
cursor: pointer;
}
/* Disable all interactions within tooltips during segments playback */
.two-row-tooltip.segments-playback-mode {
pointer-events: none !important;
/* During segments playback mode, disable button interactions but keep hover working */
.segments-playback-mode .tooltip-time-btn[disabled],
.segments-playback-mode .tooltip-action-btn[disabled] {
opacity: 0.5 !important;
cursor: not-allowed !important;
}
/* Allow pointer events only on the tooltip container itself for positioning */
.two-row-tooltip.segments-playback-mode > * {
pointer-events: none !important;
/* Ensure disabled buttons still show tooltips on hover */
.segments-playback-mode [data-tooltip][disabled]:hover:before,
.segments-playback-mode [data-tooltip][disabled]:hover:after {
opacity: 1 !important;
visibility: visible !important;
}
/* Show segments playback message */
frontend-tools/video-editor/client/src/styles/TwoRowTooltip.css
+11 -6
View File
@@ -67,6 +67,15 @@
-ms-user-select: none !important;
}
/* Force disabled tooltips to show on hover for better user feedback */
.tooltip-time-btn.disabled[data-tooltip]:hover:before,
.tooltip-time-btn.disabled[data-tooltip]:hover:after,
.tooltip-action-btn.disabled[data-tooltip]:hover:before,
.tooltip-action-btn.disabled[data-tooltip]:hover:after {
opacity: 1 !important;
visibility: visible !important;
}
.tooltip-actions {
display: flex;
justify-content: space-between;
@@ -111,9 +120,7 @@
white-space: nowrap;
opacity: 0;
visibility: hidden;
transition:
opacity 0.2s,
visibility 0.2s;
transition: opacity 0.2s, visibility 0.2s;
z-index: 2500; /* High z-index */
pointer-events: none;
}
@@ -132,9 +139,7 @@
margin-left: 0; /* Reset margin */
opacity: 0;
visibility: hidden;
transition:
opacity 0.2s,
visibility 0.2s;
transition: opacity 0.2s, visibility 0.2s;
z-index: 2500; /* High z-index */
pointer-events: none;
}