From 55d37ecd92cc7917159e55faa279f9f932c3c2b9 Mon Sep 17 00:00:00 2001 From: kgva CMS Date: Sat, 15 Aug 2026 11:50:37 +0000 Subject: [PATCH] fix: wider click tolerance on the scrub and volume bars MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit both bars are only 3px tall visually, which made them fiddly to hit precisely. added a 5px invisible hit-area above and below via ::before on each — the visual bar stays thin, but clicking near it still registers. the seek/volume math is unaffected since it reads the real elements own rect, not the pseudo-elements. --- assets/css/custom.css | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/assets/css/custom.css b/assets/css/custom.css index 6a63b18..c8c9956 100644 --- a/assets/css/custom.css +++ b/assets/css/custom.css @@ -502,6 +502,19 @@ footer a:hover, .player__time { white-space: nowrap; font-variant-numeric: tabular-nums; color: #fff; } .player__vol { width: 4ch; height: 3px; background: rgba(255, 255, 255, 0.3); position: relative; cursor: pointer; } .player__volfill { position: absolute; left: 0; top: 0; bottom: 0; width: 100%; background: #fff; } +/* invisible hit-area extending past the thin visual bar — the bar itself + stays 3px, but clicking/dragging within 5px above or below it still + counts (rects used for the seek/volume math are still the element's own, + unaffected by this) */ +.player__scrub::before, +.player__vol::before { + content: ""; + position: absolute; + top: -5px; + bottom: -5px; + left: 0; + right: 0; +} .player:fullscreen { width: 100vw; height: 100vh; aspect-ratio: auto; } /* all images always in colour (selection drives what's shown, not hover) */