Change Header Dropdown Background Colors

[CARDPIECE]

Hi there,

I am wanting to change the background color of the search field drop down as well as the cart drop down.

Its currently matching the background color of the header, I want it to be white instead.

Thanks!

Store: cardpiece.com

[Moeed]

Hey @CARDPIECE

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.liquid file

4. Add the following code in the bottom of the file above tag

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[BSS-TekLabs]

• Here is the solution for you @CARDPIECE
• Please follow these steps:

• Then find the base.css file.
• Then add the following code at the end of the file and press ‘Save’ to save it.

.search__input.field__input, predictive-search[open] .predictive-search, #cart-notification {
     background: white !important;
}
.search__input.field__input, .predictive-search__item--term, .predictive-search__item--term .icon-arrow, .predictive-search__heading, .predictive-search__item-heading, .cart-notification__heading, .modal__close-button.link, .cart-notification-product__name {
     color: black !important;
}

• Here is the result you will achieve:

• Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful. Thank you.

[BSSCommerce-TC]

Hi @CARDPIECE ,

Please insert code at the end base.css file

#predictive-search-results,
#cart-notification {
   background-color: white !important;
}

.predictive-search__item-heading,
.predictive-search__heading,
.cart-notification__heading,
.cart-notification-product__name,
#cart-notification .product-option,
.cart-notification__links button.link.button-label {
    color: #d73533 !important;
}

.cart-notification__links button[name="checkout"] {
    background: #d73533 !important;
    color: white !important;
}

#cart-notification button.cart-notification__close {
     color: #d73533 !important;
}