How can I change the dropdown menu background to white on mobile view?

Store Design
,
1

Hi there!

I recently got custom code for my drop-down menu to make the background white rather than transparent. However, it does not extend to my mobile view, only my desktop view. Can someone recommend the process on the custom code to make my dropdown menu background white?

My store is: https://cooler-drinks.myshopify.com/

PW: steeck

Thank you so much!

2

Hi @coolerdrinks

May I suggest to update code these steps:

  1. Go to Store Online-> theme ā†’ edit code

EBOOST_1-1672356985580.png
EBOOST_1-1672356985580.png532Ɨ438 15.6 KB

  1. Assets/component-menu-drawer.css
  2. Add code below to bottom of file
#menu-drawer {
	background: #fff;
}
3

Hi @coolerdrinks ,

This is Victor from PageFly - Landing page builder, Iā€™d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/component-menu-drawer.css->paste below code at the bottom of the file:

@media (max-width: 767px){
div#menu-drawer {
    background:white;
    filter: none;
}
}

Hope my answer will help you.

Best regards,

Victor | PageFly

4

Hello @coolerdrinks ,

You can follow these steps:

  1. Go to Online Store->Theme->Edit code

GemPages_0-1677554474270.png
GemPages_0-1677554474270.png400Ɨ193 29.2 KB

  1. Open your theme.liquid file, paste the below code before

GemPages_1-1677554491376.png
GemPages_1-1677554491376.png1553Ɨ895 72.9 KB

I hope the above is useful to you.

Kind & Best regards,
GemPages Support Team

5

Hi @coolerdrinks

I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the css file:
#menu-drawer {background-color: #ffff !important;}

Regards,

San

1 Like
6

I wanted to do the same thing. This solution fixed the issue quick as a wink! Thank you!!!

7

Hello,

Thank you for your reply.

Glad that you liked it.

Regards,

San