Folder (Dropdown) Navigation for Desktop -- How do I bypass the folder in mobile?

Site URL: http://www.peculiarcopy.com

So I want a clean look on my website and put my navigation pages into a folder for my desktop to make navigation a dropdown. But on mobile navigation is automatically turned into a dropdown. This then becomes annoying as you open the mobile navigation to find a single option (MENU) to click and thus open the navigation options. I want to have the folder for navigation on the desktop view but NOT on mobile. Is there code for this little workaround? 

42 minutes ago, CNI3111 said:

Site URL: http://www.peculiarcopy.com

So I want a clean look on my website and put my navigation pages into a folder for my desktop to make navigation a dropdown. But on mobile navigation is automatically turned into a dropdown. This then becomes annoying as you open the mobile navigation to find a single option (MENU) to click and thus open the navigation options. I want to have the folder for navigation on the desktop view but NOT on mobile. Is there code for this little workaround? 

You can try adding to Home > Design > Custom Css

@media only screen and (max-width: 767px) {
  .header-menu-nav-folder[data-folder="root"] {
    display: none !important;
  }
  .header-menu-nav-folder-content .header-menu-controls {
    display: none;
  }
  .header-menu-nav-folder:not([data-folder="root"]) {
    transform: unset;
    transition: unset;
  }
}

Let me know how it works on your site

Press 👍 or mark this answer as solution to help another one too

Hey! Thanks so much, that worked like a charm! @bangank36 

Hey, this worked great, but it got rid of my cta button in the mobile menu; so how do I retrieve it?

Thankfully it's visible on desktop

On 12/6/2021 at 2:54 AM, HarKS said:

Hey, this worked great, but it got rid of my cta button in the mobile menu; so how do I retrieve it?

Thankfully it's visible on desktop

Can you share link to your site? We can check problem easier.

On 12/6/2021 at 2:54 AM, HarKS said:

Hey, this worked great, but it got rid of my cta button in the mobile menu; so how do I retrieve it?

Thankfully it's visible on desktop

Let us know your site url for checking

this code work perfect but i had social media icons it was showing before now it is not showing

https://lizard-paddlefish-y53w.squarespace.com/

On 4/13/2022 at 8:02 AM, amiablege said:

this code work perfect but i had social media icons it was showing before now it is not showing

https://lizard-paddlefish-y53w.squarespace.com/

Show icons on left of logo or icons inside Mobile overlay menu?