Add Grey overlay on Sold Out Product on Collection page - Impulse Theme

[AbdulMannan]

I want to add a Grey overlay on Sold Out Product on the Collection page

Like this

Currently, this is not working

Now showing like this

Please help me with that

Thank you

[ZestardTech]

Hello There,

Please share your store URL and Password.
So that I will check and let you know the exact solution here.

[AbdulMannan]

This is our Store link

Thank you for your helping!

[AvadaCommerce]

Hi @AbdulMannan ,

To change you follow the instruction:

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css->paste below code at the bottom of the file:

.grid-product__tag.grid-product__tag--sold-out {
    color: #fff !important;
    background-color: #000 !important;
}

I hope it would help you.

[AbdulMannan]

Sir this is not working!

[ZestardTech]

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme.scss.css and paste this at the bottom of the file:

.grid-product a.grid-product__link.grid-product__link--disabled:after {
position: absolute;
content: '';
top: 0;
bottom: 0;
right: 0;
left: 0;
background: rgb(165 165 165 / 50%);
}

.grid-product a.grid-product__link.grid-product__link--disabled {
position: relative;
}

.grid-product .grid-product__meta {
background: #fff;
position: relative;
z-index: 9;
}

[AbdulMannan]

Thank you soo much, this is working perfectly

Thank you!

[ZestardTech]

Thank you for your response. It’s good to know that it’s worked for you. Kindly feel free to get back to me if you need any further assistance.

[AbdulMannan]

Of course

[AbdulMannan]

Hi @ZestardTech I need your help

Can you change the sale price color to red and bigger than the cutting price?

Like that:

Thank you!