How To Change Price Color & Compare Price in Impact Theme

[sebfe]

hello, please help me how to change price color and compare price color in impact theme, thank you,

[PageFly-Henry · Accepted solution]

Hi @sebfe 

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.css

Step 3: Paste the below code at bottom of the file -> Save

compare-at-price {

    color: red !important;

}

sale-price {

    color: black !important;

}

Hope that my solution works for you.

Best regards,

Henry | PageFly

[Moeed]

Hey @sebfe 

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

<style>
.sc-fkJVfC.gmaILq.pf-23_ {
    color: red !important;
}
.sc-fkJVfC.gmaILq.pf-24_ {
    color: gray !important;
}
</style>

RESULT:

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

Best Regards,
Moeed

[sebfe]

hello, the impact theme is in my drafts file, i tried to put it in theme.liquid but the color did not change,,

https://touchcare.shop/products 

[sebfe]

the impact theme is in my drafts, i tried to put it on theme.liquid but the color did not change

[sebfe]

why i cant send link here

[sebfe]

i already publish the impact theme, can you please check how to change the color of it, thank you

[PageFly-Henry · Accepted solution]

Hi @sebfe 

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.css

Step 3: Paste the below code at bottom of the file -> Save

compare-at-price {

    color: red !important;

}

sale-price {

    color: black !important;

}

Hope that my solution works for you.

Best regards,

Henry | PageFly

[sebfe]

thank you so much, it works,

[sebfe]

may i know too how to interchange sale price and compare price position? thank you

[PageFly-Henry · Accepted solution]

You can try with this code:

price-list.price-list.price-list--lg {
display: flex !important;

flex-direction: row-reverse !important;

}

[sebfe]

thank you