Change available on backorder color

[marika.kusnire]

Hello!

I tried to search in forum already, but can’t find solution, which works..
I would like to change “available on backorder” color in single page (line and the dot). At the time it is in the same style as “in stock”. Would like it to be different! For example, line and dot should be orange.

Could You please provide some css? 🙂

• This topic was modified 2 years, 1 month ago by marika.kusnire.

Attachments:

You must be logged in to view attached files.

Hello,

Please add the following Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

p.stock.wd-style-bordered span{
    color: #e79806 !important;
}
p.stock.wd-style-bordered span:before {
    background-color: #e79806 !important;
}

Best Regards.

Thanks, Aizaz!

But this changes just the text color for both (in stock and available on backorder) in orange. Will try to explain again.
*In stock – should stays as it is in default (not changed) (green border, green dot, dark grey font)
**Available on backorder – should be changed to (orange border, orange dot, dark grey font)

Provided css affects both – text for both is changed to orange..

Hello,

Please add the following Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

p.stock:is( .available-on-backorder) span {
    color: #e89a0c !important;
     border: 1px solid #e89a0c !important;
}

Best Regards.

Thanks, Aizaiz!
Now it looks almost as I wanted! 🙂

But not exactly..
If You gave an idea, how can achieve exact look as for in stock label, just replacing green elements (line and the dot) to orange, will be happy.. If no, then this is already better and I think will work! 🙂

Attachments:

You must be logged in to view attached files.

Hello,

Please add the following Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS. it will change the dot color on both locations.

p.stock.wd-style-bordered span:before {
    background-color: #e79806 !important;
}

Best Regards.

I needed to change the dot color just for available on backorder..
But ok – You can close the ticket. I think I will be able to change and adapt as needed with the information, which You have provided before.. 😉

Thanks for help, Aizaz! 😉

Most Welcome!!!.

I’m so happy to hear you are pleased with the Theme and Support. XTEMOS strives to deliver the best customer experience, and it makes our day to hear we have accomplished that.

We count ourselves lucky to have you as a customer. You can always reach us at any time. We are always here to help you.

Thanks for contacting us.
Have a great day.

Topic Closed.
Best Regards.

[Author]

Posts