Ethos Stack, Agency Menu Enabled Superfly - need media query selectors and code to disable the Primary Menu for all devices smaller than 1025 pixels

I am working in X-Theme using the Ethos stack with the “Agency” template and have added Superfly menu with preference settings to not show on decktops and to show on mobile devices. I have two issues that need to be addressed.

Issue #1 I can not figure out how to add the down arrow icon for the Superfly slide-out sub-menu drop down in the menu item list. Please explain how and where to add the necessary code to do this for a black down arrow icon to show up in to the right of the drop-down menu.

Issue #2 Once I have the Superfly added, I need to DISABLE the Primary Menu which is named “Primary Menu”. please provide the necessary html/css selectors and entire MEDIA QUERY code to disable X-theme Primary Menu for all mobile devices smaller than 1025 pixels. Please also include the path to the file where the code must be added.

Hi There,

Issue #1 Are you referring to something like this:

First go to Superfly menu > Advance Tab > Allow Submenu should be set to ON
Then go to Menu Items tab > Enable SUBMENU INDICATORS

Issue #2 We can use browser developer tools to select the correct selector. See this: https://screencast-o-matic.com/watch/cblthp2RHW

@media (max-width:1025px){
    .x-nav-wrap, .x-btn-navbar{
        display: none !important;
    }
}

To understand media queries better, see this: https://www.w3schools.com/css/css_rwd_mediaqueries.asp

Hope this helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.