3.1.1 Menu z-index issue with tabs and toggle switch

[Jako]

Bug report

Summary

In 3.1.1 the second level of the menu does not cover the MODX tabs and the toggle switch input.

Step to reproduce

Create/use i.e. an extras menu with many entries and open that menu with mouseover.

Observed behavior

See the following screenshot:

The tabs and the toggle switch are visible in front of the menu.

Environment

MODX 3.1.1.

[rthrash]

I suspect this can be fixed with some minor CSS updates:

#modx-leftbar { z-index: 3 }
#modx-action-buttons-container: { z-index: 2 }
#modx-content { z-index: 1 }

It needs a lot of testing! I'm going to do just that via the osTreeStyles plugin Jay created: https://community.modx.com/t/coloured-icons-in-the-resource-browser/8324/6?u=rthrash

almost there…

That basically works, but it returns another bug that was previously addressed: when going full-screen with some plugins like Ace or Monaco (using position:fixed), the left bar and action buttons overlap the full screen editor again. I suspect the way fullscreen plugins may need some tweaking as there's a conflict with our left bar/navbar/content/buttons IDs and the fullscreen overlays.

…but a full-screen overlay breaks now

how it should look (remove z-index from #modx-content)

Maybe @matdave can offer a suggestion?

[rthrash]

Related: #16690

[opengeek]

This is related to another reported problem that was created by #16690 — see #16690 (comment)