changing dropdown menu color on DAWN theme

Solved

changing dropdown menu color on DAWN theme

mgrp
Excursionist
22 1 3

Hi everyone, would appreciate some help to change the background color on my dropdown menu for both desktop and mobile, its currently like a blurry transparent and I need it to be solid (white) so the text can be seen without being obstructed by the background.  Website is https://d9423d-93.myshopify.com/ thanks in advance 

 

also the country selector dropdown is a blue color and I don't know why, so having that be white would be preferred as well to match

Accepted Solution (1)

websensepro
Shopify Partner
1914 229 273

This is an accepted solution.

Hello @mgrp ,

 

Go to online store > themes > Edit code > Find base.css file

Add to the given code at the bottom of the file base.css 

 

.menu-drawer__navigation {
 
    background-color: white;
}
.header__submenu .header__menu-item {
   
    background-color: white;
}

save changes.

 

Result mobile menu.pngsubmenu dropdown.png

Need a Shopify developer? Hire us at WebSensePro For Shopify Design Changes/Coding
For Free Tutorials Subscribe to our youtube
Get More Sales Using Big Bulk Discount APP
Create Your Shopify Store For Just 1$/Month
Get More Sales Using Big Bulk Discount APP

View solution in original post

Replies 3 (3)

AnneLuo
Shopify Partner
1299 228 266

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code to the head tag

<style>
  .menu-drawer__navigation, .header__inline-menu .global-settings-popup {
    background: #fff !important;
  }
</style>

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

If this is helpful, please Like and Accept the solution.
Want to modify or custom changes on store? Let me help.
- Feel free to Email Me   

Buy Me A Coffee

websensepro
Shopify Partner
1914 229 273

This is an accepted solution.

Hello @mgrp ,

 

Go to online store > themes > Edit code > Find base.css file

Add to the given code at the bottom of the file base.css 

 

.menu-drawer__navigation {
 
    background-color: white;
}
.header__submenu .header__menu-item {
   
    background-color: white;
}

save changes.

 

Result mobile menu.pngsubmenu dropdown.png

Need a Shopify developer? Hire us at WebSensePro For Shopify Design Changes/Coding
For Free Tutorials Subscribe to our youtube
Get More Sales Using Big Bulk Discount APP
Create Your Shopify Store For Just 1$/Month
Get More Sales Using Big Bulk Discount APP
mgrp
Excursionist
22 1 3

THANK YOU!!!! worked perfectly, I think I must've added some code to hide something because you see those little transparent bars still on the menu, I don't know why its doing that and I'm baffled as to what I did lol