Hello, I would like to remove the solid gray that appears when I hover my drawer menu. I just want it plain white background. Could anyone help me? Thank you
PW: CollectionThree
Topic summary
A user seeks help removing the gray background that appears when hovering over their drawer menu, wanting a plain white background instead.
Initial Solution Attempt:
- A community member provided CSS code to be added to the theme.liquid file before the
</body>tag - The code targeted the menu item hover state with
background-color: #fff !important - Used a media query for screens with max-width: 767px
Current Status:
- The original poster reported the first solution didn’t work
- A revised CSS solution was provided with adjusted selectors targeting
.menu-drawer__menu-item.active - The discussion remains open, awaiting confirmation on whether the updated code resolves the issue
Both solutions involve adding custom CSS through the Shopify theme editor to override the default gray hover background.
PW: CollectionThree
Hello @clayinfo
You can add code by following these steps
-
Go to Online Store → Theme → Edit code.
-
Open your theme.liquid file
-
Paste the below code before on theme.liquid
Hello, I tried this and it didnt work
Hello @clayinfo
You can add code by following these steps
-
Go to Online Store → Theme → Edit code.
-
Open your theme.liquid file
-
Paste the below code before on theme.liquid
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.