How can I change the color of a notification dot on Impact theme?

Store Design
, , ,
1

Hi, I m trying to change the color of this notification dot from black to red. I m using the Impact theme, not able find how to change it, does anyone know how to ? Thanks in adavance. Please refer to the screen shot attached :

Screenshot 2023-08-16 at 17.30.03.png
Screenshot 2023-08-16 at 17.30.03.png2124Ă—1742 412 KB

1 Like
2

Hi @DeepeshHarbola

Try this one, if its not working would you mind to share your store URL website with password if its protected? Thanks!

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  • In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
cart-count.count-bubble.opacity-0 {
    background: red;
}
  • I hope it help.
  • Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!
1 Like
3

Hi @DeepeshHarbola

This is Anthony from Beae Landing Page Builder, and I’m happy to assist you today.

While I acknowledge that this issue falls short of the desired outcome, I have an idea that I believe might be of help:

  1. Go to Online Store → Theme → Edit code.

  2. Open your assets/theme.css file.

  3. Add the code at the end of the file:

cart-count.count-bubble.opacity-0 {
    background: red;
}

Best regards,

Anthony

1 Like
4

I pasted the code in ttheme.css , but its not changing the color, its still the same :disappointed_face:

1 Like
5

this doesnt work for me, i tried

6

Would you minsd to share your store URL website? with password if its protected. So I can provide you the exact code, the code that I used is only the demo from the Impact theme. You can also PM me if you dont like to public your store. Thanks!

7

Hi @DeepeshHarbola

Please add the code below

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  • In the “Assets” folder, click on “theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

NOTE: Change the background color to your color of choice, and change the text color by changing the color.

.header__cart-count .count-bubble {
    background: white;
    color: black;
}
  • I hope it help.
  • Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!