From 4fa33e981030c96ef7e5a7e0f8a9c3aca26c035a Mon Sep 17 00:00:00 2001 From: Jonathan Sykes Date: Wed, 14 Oct 2026 08:23:23 +0800 Subject: [PATCH] Phone PWA: no backdrop blurs over video, cap auto quality at 480p on touch phones --- frontend/app.js | 8 ++++++-- frontend/styles.css | 7 +++++++ 2 files changed, 13 insertions(+), 2 deletions(-) diff --git a/frontend/app.js b/frontend/app.js index 8294e0a..d77b212 100755 --- a/frontend/app.js +++ b/frontend/app.js @@ -3032,9 +3032,13 @@ function chooseQuality() { const match = qs.find((q) => q.label === pref); if (match) return match; } - // auto: best quality at or below 720p, else the lowest available. + // auto: best quality at or below 720p (480p on touch phones, where a lossy + // link rebuffers the picture while the separate audio keeps playing), + // else the lowest available. + let cap = 720; + try { if (matchMedia('(pointer: coarse)').matches && Math.min(screen.width, screen.height) < 600) cap = 480; } catch {} const sorted = [...qs].sort((a, b) => b.height - a.height); - return sorted.find((q) => q.height <= 720) || sorted[sorted.length - 1]; + return sorted.find((q) => q.height <= cap) || sorted[sorted.length - 1]; } function buildQualityMenu() { diff --git a/frontend/styles.css b/frontend/styles.css index 5a9cff8..41670f9 100755 --- a/frontend/styles.css +++ b/frontend/styles.css @@ -2267,6 +2267,13 @@ input[type="range"]::-webkit-slider-thumb:hover { transform: scale(1.25); } .player-pane:not(.empty) .player-stage { box-shadow: 0 0 0 1px var(--line) inset; } + /* The per-layout themes (html[data-layout=...] .topbar etc.) out-rank the + * rules above and bring 20px blurs back over the playing video, as do the + * lyrics bar buttons and section rail. Nothing on a phone PWA may blur. */ + *, *::before, *::after { + backdrop-filter: none !important; + -webkit-backdrop-filter: none !important; + } } /* ============================================================================