How can I change my product page text color and sale badge background?

Store Design
,
1

windef_0-1673090282639.png
windef_0-1673090282639.png604×223 3.31 KB

Hello, on the product page i’ve got black text “25% Best deal!” text which i want to be in white and i can’t figure it out on how to do it

windef_1-1673090403297.png
windef_1-1673090403297.png157×101 3.41 KB

And here i have the sale badge in white and text in black how could i change the background color to red and the text white and bold?

Could anyone please assist me on this?

2

Hello @windef

I would like to give you a solution to support you:

  1. Go to Online Store-> Theme-> Edit code
  2. Open your theme.liquid theme file
  3. Paste the below code before :
<style>
.badge.price__badge-sale.color-background-2 {
color: white !important;
}
</style>

Was my reply helpful? Please Like and Accept Solution. This mean alot to me.

3

Hello @windef

It’s GemPages support team and glad to support you today.

I would like to give you a solution to support you.

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

  2. Open your theme.liquid theme file.

  3. Paste the below code before :

Hope my solution can work and support you!

Kind & Best regards!

GemPages Support Team.

1 Like
4

I would like to give you a solution to support you:

  1. Go to Online Store-> Theme-> Edit code
  2. Open your base.css theme file
  3. Paste the code in bottom of file

.product__info-wrapper span.badge.price__badge-sale.color-background-2 {
color: #fff !important;
}

5

The first question:

.price .price__badge-sale{
color:#fff !important;
}

The second question:

.card__content .card__badge .badge{
color:#fff;
font-weight:900;
}