From 2b0287c2f1455d56d3b06da5d0a1aca994df5c56 Mon Sep 17 00:00:00 2001 From: 4gray Date: Tue, 5 May 2026 09:14:35 +0200 Subject: [PATCH] fix(embedded-mpv): reserve controls strip so hover reveal works MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The native MPV NSView sits above the WebContents and is sized to the viewport rect, so any DOM region it covers never receives pointer events. Bundle 1 made the viewport fill the whole player, leaving no DOM strip to catch pointermove — once the controls faded out there was no way to bring them back via hover. Reapply the bottom inset on the viewport, scoped to the slimmer 64 px panel, so the bottom strip is DOM-only and hover wakes the controls. Swap the gradient for the glass surface treatment now that the panel no longer needs to fade into video. Co-Authored-By: Claude Opus 4.7 (1M context) Entire-Checkpoint: f957cd9849e0 --- .../embedded-mpv-player.component.scss | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) diff --git a/libs/ui/playback/src/lib/embedded-mpv-player/embedded-mpv-player.component.scss b/libs/ui/playback/src/lib/embedded-mpv-player/embedded-mpv-player.component.scss index e99b6dcf8..61a58f9f9 100644 --- a/libs/ui/playback/src/lib/embedded-mpv-player/embedded-mpv-player.component.scss +++ b/libs/ui/playback/src/lib/embedded-mpv-player/embedded-mpv-player.component.scss @@ -46,6 +46,14 @@ background: var(--mat-sys-surface); } +/* The native MPV NSView sits above the WebContents and is sized to the + viewport rect, so any region it covers cannot receive pointer events. + Reserve the control-bar height as a DOM-only strip at the bottom so + moving the cursor toward the bottom of the player wakes the controls. */ +.embedded-mpv-player--controls-enabled .embedded-mpv-player__viewport { + bottom: var(--embedded-mpv-controls-height); +} + .embedded-mpv-player__loader { position: absolute; inset: 0; @@ -96,12 +104,9 @@ opacity: 0; pointer-events: none; transform: translateY(8px); - background: linear-gradient( - 180deg, - transparent 0%, - rgba(0, 0, 0, 0.55) 50%, - rgba(0, 0, 0, 0.78) 100% - ); + background: var(--embedded-mpv-glass); + border-top: 1px solid var(--embedded-mpv-border); + backdrop-filter: blur(18px); transition: opacity 180ms ease-out, transform 200ms ease-out;