Make cart count bubble color dependent on number of items in cart (Dawn 10.0 Theme)

[bet]

Currently, my cart count bubble is always the color #FF0998, whether there are 0 or more items in the cart.

I would like the cart count bubble to display colors as follows:
A) To be color #7810D7 when there are 0 items in the cart
B) To be color #FF0998 when there are 1 or more items in the cart.

What would the css / code adjustments be to make this work on my Shopify Dawn 10.0 theme at my website:

BuyExcelTemplates.com

Thank you.

[Moeed · Accepted solution]

Hey @bet 

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 </body> tag

{% if cart.item_count == 0 %} 
<style>
.cart-count-bubble {
    background-color: #7810D7 !important;
}
</style>
{% endif %}

RESULT:

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

Best Regards,
Moeed

[bet]

Cool that worked!  I was wondering if there is code that would accomplish the same thing but with just using the css theme files and not the liquid theme file?  If possible, what would the css code look like to accomplish this?

Thank you.

[Moeed]

You need to use if else condition so it's not possible to add the code in the css files, you need to add the code in the liquid file.

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

Best Regards,
Moeed

[bet]

Great thank you.

[Moeed]

Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.