jeffemmett
/
rspace-online
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: contain MI bar z-index within header stacking context on mobile 

On desktop the header is position:fixed which creates a stacking
context, containing the MI bar's z-index:10001. On mobile the header
switches to position:sticky without z-index, so no stacking context
is created and the MI bar's z-index leaks out above the tab row
(z-index:9998). Fix by adding z-index:9999 to the header on mobile.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Jeff Emmett 2026-03-31 10:32:36 -07:00
parent 6c7c00dc95
commit 24c1598e60
2 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
shared/components/rstack-mi.ts
View File

@ -1100,7 +1100,6 @@ const STYLES = `
} }
@media (max-width: 640px) { @media (max-width: 640px) {
.mi-bar { display: none; }
.mi { max-width: none; width: 100%; } .mi { max-width: none; width: 100%; }
.mi-panel { .mi-panel {
position: fixed; top: 0; left: 0; right: 0; bottom: 0; position: fixed; top: 0; left: 0; right: 0; bottom: 0;

5
website/public/shell.css
View File

@ -361,6 +361,7 @@ body.rstack-sidebar-open #toolbar {
the header wrap naturally to two rows. */ the header wrap naturally to two rows. */
.rstack-header { .rstack-header {
position: sticky; position: sticky;
z-index: 9999;
padding: calc(6px + env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 6px max(12px, env(safe-area-inset-left)); padding: calc(6px + env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 6px max(12px, env(safe-area-inset-left));
height: auto; height: auto;
flex-wrap: wrap; flex-wrap: wrap;
@ -374,8 +375,8 @@ body.rstack-sidebar-open #toolbar {
.rstack-header__center { .rstack-header__center {
order: 3; order: 3;
flex-basis: 100%; flex-basis: 100%;
padding: 0; padding: 4px 0 2px;
display: none; display: flex;
} }
.rstack-header__right { .rstack-header__right {
flex: 0 0 auto; flex: 0 0 auto;