How to change cart bubble color in Dawn theme?

Hi all,

Does anyone know how to change the color of the bubble only in the cart count for the Dawn theme?

As you can see below the number is there but because the bubble has the same color you cannot see it.

Thanks in advance!

Miquel

Hello There,

  1. In your Shopify Admin go-to online store > themes > actions > edit code
  2. Find Asset >base.css and paste this at the bottom of the file:
.cart-count-bubble {
color: #000!important;
}

Hi, thanks for helping.

This changed only the number in the bubble, I am looking to change the background color of this bubble.

Hello There,

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset >base.css and paste this at the bottom of the file:
.cart-count-bubble {
position: absolute;
color: #fff;
background-color: #000;
height: 1.7rem;
width: 1.7rem;
border-radius: 100%;
display: flex;
justify-content: center;
align-items: center;
font-size: .9rem;
bottom: 0.8rem;
left: 2.2rem;
line-height: calc(1 + .1 / var(--font-body-scale));
}

You are the best!! Thank you so much

Thank you for your response. It’s good to know that it’s worked for you.
If helpful then please Like and Accept the Solution All.

Do you also know by any chance a solution for the following:

The counting in the cart added and final cart is different.

As you can see in the printscreen below.

The 1 is only calculating the number of different products while the other (4) is calculating the total, which makes sense.

I would like to have the total (so 4 on both)

Hello There,

Please share your store URL and password.
So that I will check and let you know the exact solution here.

www.chefmallows.nl

Teammallows!

Hello there,
Working fine!
Screenshot:-Screenshot by Lightshot

Only if you add different products. If you add the same product multiple times it goes wrong.

It looks like it calculates the number of different products instead of the total