From ed46011ae4ffc35ff2a36457cbbce9c0514961da Mon Sep 17 00:00:00 2001 From: ScreenTinker Date: Tue, 28 Apr 2026 14:59:23 -0500 Subject: [PATCH] Pin YouTube iframe to fill the player container MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The .zone iframe sizing rule only applies to multi-zone layouts. In fullscreen single-zone mode the YT IFrame API replaces our placeholder div with an iframe directly inside #playerContainer, where no CSS rule sized it — leaving it at the iframe default size (~300x150) and producing a tiny square in the corner. Added explicit rules so any iframe child of #playerContainer fills the viewport. Co-Authored-By: Claude Opus 4.7 (1M context) --- server/player/index.html | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/server/player/index.html b/server/player/index.html index 67b5f6e..afc3652 100644 --- a/server/player/index.html +++ b/server/player/index.html @@ -34,6 +34,11 @@ /* Player */ #playerContainer { position: fixed; inset: 0; background: #000; } + /* Fullscreen single-zone playback: YouTube's IFrame API replaces our placeholder + with an iframe whose width/height attributes don't always survive layout. Pin + any direct iframe child to the container so YT/widget embeds fill the screen. */ + #playerContainer > iframe, + #playerContainer > div > iframe { width: 100%; height: 100%; border: none; display: block; } .zone { position: absolute; overflow: hidden; } .zone video { width: 100%; height: 100%; object-fit: cover; } .zone img { width: 100%; height: 100%; object-fit: cover; }