video discover: lift page-wide controls into a distinct 'Across Discover' bar

Hide-owned + language + my-services were inside the Browse-all filter panel, making them read
as grid-only when they actually affect every rail. Moved them into a labelled 'Across Discover'
strip above the Browse panel (JS finds them by data-attribute, so no logic change). Browse panel
now holds only its grid filters (kind/sort/genre/source/decade).
video
BoulderBadgeDad 5 days ago
parent 5906576a13
commit dffc5c2e5d

@ -1037,6 +1037,40 @@
<div class="vdsc-amb" data-vdsc-amb aria-hidden="true"></div>
<button class="vdsc-ignore-btn" type="button" data-vdsc-ignore-open title="Manage your Not-interested list"><span aria-hidden="true">🚫</span> Ignore List</button>
<div class="vdsc-hero hidden" data-vdsc-hero></div>
<!-- Page-wide controls — these affect the WHOLE Discover page (every rail),
not just the "Browse all" grid below. Kept out of the browse panel so
that's clear. -->
<div class="vdsc-global">
<span class="vdsc-global-label">Across Discover</span>
<label class="vdsc-toggle">
<input type="checkbox" data-vdsc-hideowned>
<span>Hide owned</span>
</label>
<div class="vdsc-langs" data-vdsc-langs aria-label="Rail languages" title="Which original languages show in the rails">
<span class="vdsc-langs-label">🌐</span>
<button class="vdsc-lang vdsc-lang--on" type="button" data-lang="en">EN</button>
<button class="vdsc-lang" type="button" data-lang="ko">KO</button>
<button class="vdsc-lang" type="button" data-lang="ja">JA</button>
<button class="vdsc-lang" type="button" data-lang="es">ES</button>
<button class="vdsc-lang" type="button" data-lang="fr">FR</button>
<button class="vdsc-lang" type="button" data-lang="hi">HI</button>
<button class="vdsc-lang" type="button" data-lang="de">DE</button>
<button class="vdsc-lang" type="button" data-lang="it">IT</button>
</div>
<div class="vdsc-langs" data-vdsc-myprov aria-label="My streaming services" title="Your streaming services power the 'On your streaming services' rail">
<span class="vdsc-langs-label">📺 My services</span>
<button class="vdsc-lang" type="button" data-prov="8">Netflix</button>
<button class="vdsc-lang" type="button" data-prov="9">Prime</button>
<button class="vdsc-lang" type="button" data-prov="337">Disney+</button>
<button class="vdsc-lang" type="button" data-prov="1899">Max</button>
<button class="vdsc-lang" type="button" data-prov="350">Apple TV+</button>
<button class="vdsc-lang" type="button" data-prov="15">Hulu</button>
<button class="vdsc-lang" type="button" data-prov="531">Paramount+</button>
<button class="vdsc-lang" type="button" data-prov="386">Peacock</button>
</div>
</div>
<div class="vdsc-browse">
<div class="vdsc-browse-top">
<div class="vdsc-seg" data-vdsc-seg="kind" role="group" aria-label="Type">
@ -1048,32 +1082,6 @@
<button class="vdsc-seg-btn" type="button" data-val="vote_average.desc">Top Rated</button>
<button class="vdsc-seg-btn" type="button" data-val="vote_count.desc">Most Voted</button>
</div>
<label class="vdsc-toggle">
<input type="checkbox" data-vdsc-hideowned>
<span>Hide owned</span>
</label>
<div class="vdsc-langs" data-vdsc-langs aria-label="Rail languages" title="Which original languages show in the general rails">
<span class="vdsc-langs-label">🌐</span>
<button class="vdsc-lang vdsc-lang--on" type="button" data-lang="en">EN</button>
<button class="vdsc-lang" type="button" data-lang="ko">KO</button>
<button class="vdsc-lang" type="button" data-lang="ja">JA</button>
<button class="vdsc-lang" type="button" data-lang="es">ES</button>
<button class="vdsc-lang" type="button" data-lang="fr">FR</button>
<button class="vdsc-lang" type="button" data-lang="hi">HI</button>
<button class="vdsc-lang" type="button" data-lang="de">DE</button>
<button class="vdsc-lang" type="button" data-lang="it">IT</button>
</div>
<div class="vdsc-langs" data-vdsc-myprov aria-label="My streaming services" title="Your streaming services power the 'On your streaming services' rail">
<span class="vdsc-langs-label">📺</span>
<button class="vdsc-lang" type="button" data-prov="8">Netflix</button>
<button class="vdsc-lang" type="button" data-prov="9">Prime</button>
<button class="vdsc-lang" type="button" data-prov="337">Disney+</button>
<button class="vdsc-lang" type="button" data-prov="1899">Max</button>
<button class="vdsc-lang" type="button" data-prov="350">Apple TV+</button>
<button class="vdsc-lang" type="button" data-prov="15">Hulu</button>
<button class="vdsc-lang" type="button" data-prov="531">Paramount+</button>
<button class="vdsc-lang" type="button" data-prov="386">Peacock</button>
</div>
</div>
<div class="vdsc-chips" data-vdsc-chipset="genre" aria-label="Genre">
<button class="vdsc-chip vdsc-chip--on" type="button" data-val="">All genres</button>

@ -2364,6 +2364,15 @@ body[data-side="video"] #soulsync-toggle { display: none; }
.vdsc-lang:hover { color: rgba(255, 255, 255, 0.85); }
.vdsc-lang--on { color: #fff; background: rgba(var(--accent-rgb, 88 101 242), 0.85); border-color: transparent; }
/* ── Page-wide Discover controls (sit above the Browse panel; affect every rail) ── */
.vdsc-global { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px;
padding: 11px 16px; margin: 14px 0 6px; border-radius: 14px;
background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(255, 255, 255, 0.06); }
.vdsc-global-label { font-size: 10.5px; font-weight: 800; letter-spacing: 0.6px; text-transform: uppercase;
color: rgba(255, 255, 255, 0.32); margin-right: 2px; }
.vdsc-global .vdsc-toggle { margin-left: 0; }
.vdsc-global .vdsc-langs { margin-left: 0; }
/* ── 'Not interested' card button ──────────────────────────────────────────── */
.vsr-card { position: relative; }
.vsr-notint { position: absolute; top: 6px; left: 6px; z-index: 6; width: 24px; height: 24px;

Loading…
Cancel
Save