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:
parent
6c7c00dc95
commit
24c1598e60
|
|
@ -1100,7 +1100,6 @@ const STYLES = `
|
|||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.mi-bar { display: none; }
|
||||
.mi { max-width: none; width: 100%; }
|
||||
.mi-panel {
|
||||
position: fixed; top: 0; left: 0; right: 0; bottom: 0;
|
||||
|
|
|
|||
|
|
@ -361,6 +361,7 @@ body.rstack-sidebar-open #toolbar {
|
|||
the header wrap naturally to two rows. */
|
||||
.rstack-header {
|
||||
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));
|
||||
height: auto;
|
||||
flex-wrap: wrap;
|
||||
|
|
@ -374,8 +375,8 @@ body.rstack-sidebar-open #toolbar {
|
|||
.rstack-header__center {
|
||||
order: 3;
|
||||
flex-basis: 100%;
|
||||
padding: 0;
|
||||
display: none;
|
||||
padding: 4px 0 2px;
|
||||
display: flex;
|
||||
}
|
||||
.rstack-header__right {
|
||||
flex: 0 0 auto;
|
||||
|
|
|
|||
Loading…
Reference in New Issue