I'm building a new site using the Delight theme. I've modified the user menu at the top so that it has a couple of submenu items. I tested it on my iPad Pro and found that there is a an overlay that gets added when the menu opens with the class g-menu-overlay-open.
First off, I like the idea but unfortunately that class seems to be a bit problematic.
Since I have added submenu items to the user menu at the top, when you click the drop-down arrow to show the submenu, it places the overlay on everything including the user menu and submenu items at the top. The only thing not covered by the overlay is the navigation section.
On a smaller tablet screen, where the main menu is hidden, and only the particle "search/login/offcanvas" particle is visible in the navigation section, then when you click the drop-down arrow, the navigation section is once again above the overlay hiding the user menu and submenu items.
Also of issue, is the fact that the overlay class, g-menu-overlay-open, only seems to be triggered by tapping on the drop-down arrows. If you tap directly on the menu item title, the submenu will show but the overlay does not appear.
With these things in mind, I have 2 questions.
Is it possible to modify the class so that it is triggered even when tapping on the menu item title showing the submenu? I'm also assuming this is only for tablets, correct?
How can the class be modified, so that when it is triggered by the user menu at the top, that either the user menu and submenu items, or the top section, sits above the overlay?
If it is not possible to do these things, especially #2 having the user menu sit above the overlay when triggered, how can is disable this overlay feature?
Thanks in advance for your help!