Mobile Menu Button - Click for Submenu Dropdown

[brettfish]

We added some shopping linkds to our site, and added a “Shop” button in the main nav/links for it to stand out. There are 2 submenu items below it - merch and gift cards (separate links because they are on separate platforms).

On desktop, it works great, as when you hover over the “Shop” button, the two sub-menu items appear in the drop-down. But on mobile it only works if you click on the right side of the button - where the submenu icon would be (we removed it because it looked weird having the icon next to the button).

Is there a way to have the whole button click on mobile open the submenu dropdown?

Our site is

Summary

https://calozzis.net/

[prakash_s]

Hello @brettfish,

Thanks for writing to us.

I would suggest you please go to the Menu—>add the custom CSS class to the menu item.

Now you need to add this custom CSS code to the global CSS.

.x-nav-wrap.mobile li.custom-shop-btn .x-sub-toggle {
width: 100%;
} 

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.In case if you have no idea about coding you can subscribe to One where customization questions are answered.

Hope it helps.
Thanks

[brettfish]

@prakash_s

.x-nav-wrap.mobile li.custom-shop-btn .x-sub-toggle {
width: 100%;
} 

Works great - thank you!

[prakash_s]

You are most welcome @brettfish