How to change sale price color in District template without affecting full price items?

[DaniAG]

hi there,

I had some help yesterday to change the sale price colour in my District template, but I just realized that the code changed the colour of the full price items too.

Would someone be able to help me to tweak the code? I closed my previous post so I think the person who helped me is not being able to get my message.

My store is www.madetobefree.com.au

This needs to be dark grey:

   

This is good as is:

Thank you so much.

Dani

[MandasaTech]

Hello @DaniAG 

Add this code below of theme.css file.

.price span.money {
 color: #4f4f4f !important;

}

[DaniAG]

hi there, I tried but it changed all the prices to grey including the sale price..

[PageFly-Victor]

Hi @DaniAG,

This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

You can't change the color for the price to 2 different colors because it's the same class. Instead, you can do it like this:

If you like it, please add this css at the bottom:

Online Store ->Theme ->Edit code

Assets -> section-image-banner.css

span.original-price.money {
    color: #b81de1 !important;
}

Hope you find my answer helpful!

Best regards,

Victor | PageFly

[DaniAG]

hi Victor,

thanks for taking the time to suggest the code above. 

I see that this website below for instance have it as I'm trying to do with mine..  I mean most of the websites do:

Activewear, Sports Bras & Leggings on Sale | Lorna Jane AU

Lorna Jane New Activewear Arrivals | Lorna Jane Australia

Do you mean that there is not such a code to do that in my theme?

Thank you,

Dani

[PageFly-Victor · Accepted solution]

Hi @DaniAG ,

This is Victor from PageFly - Shopify Page Builder App., I’d like to suggest this idea:

I found a way to get this working you can try with this code:

Add this css at the bottom

Online Store ->Theme ->Edit code

Assets -> theme.scss.css

.price:has(.money~.original-price.money) .money:first-child {

    color: rgb(184,29,225) !important;

}

Hope you find my answer helpful!

Best regards,

Victor | PageFly

[DaniAG]

hi Victor, so sorry just now I saw this and it worked! Thank you so much!