Change background color in dropdown in Venture theme

[entranced]

Hi,

How is it possible to change the background color in the dropdown-menu in theme Venture?
I found out how to replace the background on the sides of the dropdown in the theme.scss at row 3384

.meganav {
display: block;
visibility: hidden;
right: 0;
background-color: $color-content; (I changed this to yellow as in attached printscreen)

But I cant find any way to change the background in the products which pop-ups in the dropdown (please see attached printscrren).

Thanks in advance!

[dmwwebartisan]

@entranced 

Please share your website URL and password if any. I will check and provide a solution here.

Thanks!

[entranced]

Hi,

www.wixter.se 

password: access1234

[Bo · Accepted solution]

Hey there, @entranced 

Bo here from Shopify Support! 

That is a really great question, I was able to look into this for you and figured it out. Now, I noticed that you mentioned you edited a specific line of your theme.scss. When editing the CSS of your theme.scss we recommend adding CSS to the bottom of the file as opposed to altering the preexisting code. The new code added to the bottom will overwrite the previous code. So, in future, find the code you want to edit, copy the code and paste it at the very bottom of the file and then make your edits. This way if there are any issues caused by the code edit it is very easy to remove as opposed to trying to remember what to change it back to exactly. When editing the code of your theme it is always a good idea to duplicate your theme first and making the changes on the duplicate. 

Steps: 

1. Go to Online Store > Themes > Actions > Edit Code.

2. Open the theme.scss.liquid file and scroll to the bottom of it. 

3. Paste the following code at the bottom of the file:

.meganav__product {
  .product-card {
    border-bottom-width: 0;
    background: yellow;
  }
}
.meganav__product {
  .product-card__info {
    background: yellow;
  }
}

You can of course use the hex code for whatever shade of yellow you would like as opposed to just the standard yellow in this example. Instead of writing the name of the color that you would like the background to be, you can input the hex code of the color found in this hex color picker online.

4. Click Save. 

Let me know how this goes and if there is anything else I can assist you with, I'm happy to help!

All the Best,

Bo

[entranced]

Thank you for your input, Bo. That did the trick!