Change color of text in Cart Drawer ONLY (Avone Theme)

Store Design
1

Good Day!

Disclaimer: this website contains adult products.

I am trying to change the color of the text in the cart drawer. Currently, the font color is white over a white background (See image), making it impossible to see the text. There is no option to change the font color only in the theme customization settings. When I attempt to edit the code, to change the color to black, that also doesn’t work.

Is there a way to alter/ override the current text colors and complete this? I would also be happy with changing the cart drawer background to black.

Thanks in Advance!

1 Like
2

@Snohx

Welcome to the Shopify community!
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

3

@Zworthkey Thank you! Here’s the link to my site.

4

@Snohx

Which text color do you want to change.

whole body and which color you want.

5

I would like to change the text of the product information (name, price, etc.) in the cart drawer that pop’s up on the R side of the page, after you click the cart button to see what’s in your bag. I would like to change that color to black.

6 
ul.mini-products-list {
    color: black !important;
}
#cart-drawer .close-cart {
    color: #000000 !important;
}
.mini-products-list li .pName {
    color: #000000 !important;
}

@Snohx

  1. Navigate to Online Store->Theme->Edit code
  2. Asset->/theme.css or theme.scss->paste Above code at the bottom of the file.
  3. Save it.

Add this code in the bottom of the theme.scss or theme.css file.

1 Like
7

Thank you so much! @Zworthkey . For some reason, I am having the same issue with the font when I click the search icon. It asks “What are you looking for” (but it cannot be seen because it is white) and when I type in my search word, it is also white. How do I also change these texts to black?

Thank you again.

8 
#cart-drawer > h4, #cart-drawer > .h4 {
    color: #020202 !important;
}
#cart-drawer .close-cart {
    color: #000000 !important;
}
#searchPopup .btn {
    color: #000000 !important;
}
#searchPopup .search__input, #searchPopup .search__input::-webkit-input-placeholder {
    color: #000000 !important;
}

@Snohx
Add this code.

9

Thank you so much!