Shopify themes, liquid, logos, and UX
I have been able to change the hover color for specific menu bar elements on the desktop site by adding a hover line for the corresponding span element in the css, however, I'm not able to do this for mobile even though I copy the CSS selector. Can someone guide me through this? I've attached the relevant section from the website. I'm just not sure how to go about picking a selector for these elements, and if the code has to be added to theme.liquid or to base.css
<nav class="menu-drawer__navigation">
<ul class="menu-drawer__menu has-submenu list-menu" role="list"><li><a id="HeaderDrawer-home" href="/" class="menu-drawer__menu-item list-menu__item link link--text focus-inset menu-drawer__menu-item--active" aria-current="page">
Home
</a></li><li><a id="HeaderDrawer-catalog" href="/collections/all" class="menu-drawer__menu-item list-menu__item link link--text focus-inset">
Catalog
</a></li><li><a id="HeaderDrawer-contact" href="/pages/contact" class="menu-drawer__menu-item list-menu__item link link--text focus-inset">
Contact
</a></li></ul>
</nav>
We need more information than just code to help. Please provide more context: your store url, password if locked. Screenshots on what you want to do.
Don't assume that we have all the information you need just because you have provided a code. If you need help from the community, you have to help us to provide enough context to help.
Please, share your store URL. Thanks!
Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025