got-feedBack/feedBack
1
0
Fork 0
mirror of https://github.com/got-feedBack/feedBack.git synced 2026-09-11 02:14:29 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

fix(v3): topbar stacks above the Songs filter bar (instrument/tuner dropdowns)

Browse Source 
The v3 Songs filter/search bar (added by #857) is `sticky top-0 z-20 backdrop-blur`
— the SAME z-index and stacking-context recipe as the global topbar, and being
later in source order it won the z-20 tie and painted over the topbar's whole
subtree. So the topbar's instrument-selector dropdown (`data-inst-menu`, z-50
*within* the topbar's z-20 context) rendered BEHIND the filter bar.

Bump the topbar to z-30 so it (and its dropdowns) stack above the per-screen
filter bar. `.z-30` is already in the prebuilt tailwind.min.css, so no rebuild.

Reproduced + verified headless: in the filter-bar/menu overlap region the
topmost element flips from the filter bar's <select> to the instrument menu.
(The tuner panel #tuner-plugin-ui is z-[1000] on document.body and was already
on top — unaffected.)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
(cherry picked from commit 45bfd9cc9c6981a10a9f2441638b7e5bee760dc8)
This commit is contained in:
Byron Gamatos
2026-06-17 23:42:46 -07:00
committed by Bret Mogilefsky
parent cad78857fb
commit e2cf9fa9a2
1 changed files with 6 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/v3/shell.js
+6 -1
View File
@@ -145,7 +145,12 @@
function renderTopbar() {
const bar = document.getElementById('v3-topbar');
if (!bar) return;
bar.className = 'sticky top-0 z-20 bg-fb-sidebar/80 backdrop-blur';
// z-30 (not z-20): the global topbar must stack above per-screen sticky
// bars — notably the v3 Songs filter/search bar, which is also
// `sticky top-0 z-20 backdrop-blur` and, being later in source order,
// otherwise wins the z-index tie and paints over the topbar's instrument
// selector / tuner dropdowns (slopsmith#857 regression).
bar.className = 'sticky top-0 z-30 bg-fb-sidebar/80 backdrop-blur';
bar.innerHTML =
// Row 1 — top utility bar: search.
'<div class="flex items-center gap-4 px-4 md:px-8 pt-4">' +