[SOLVED] How to add a grey filter on "Out of stock" products?

[Learthe]

Hi everyone, I kept my images of out of stock items reporting their opacity automatically. I searched in product-list.tpl but I don't know what to put. do you see me helping? I put you 2 images to better show you what I want.

 

My website :https://armoiredesimone.fr/armoire/

 

What i want : 

 

 

 

 

 

Edited January 27, 2023 by Learthe (see edit history)

[ps8modules]

Hi,

modify css in ./themes/theme_ecolife/assests/css/theme.css

Go to line 12437

Change to:

.product-flag .out_of_stock {
  background: #14d03a;
}

Save and clear cache.

 

Result:

Edited January 27, 2023 by prestashopfree.com (see edit history)

[Learthe]

8 hours ago, prestashopfree.com said:

Hi,

modify css in ./themes/theme_ecolife/assests/css/theme.css

Go to line 12437

Change to:

.product-flag .out_of_stock {
  background: #14d03a;
}

Save and clear cache.

 

Result:

Hello, thank you a lot for your reply, but this not what i want.

i want to add a grey filter on out of stock images products like in the pic i put on the topic 🤓

i think i need to add something in product-list.tpl but its not working..

Edited January 27, 2023 by Learthe (see edit history)

[Learthe]

SOLVED, thanks to @joseantgv

 

i searched a file in themes/classic/templates/catalog/_partials/miniatures/product.tpl 

 

and added this code :

 

{if !$product.allow_oosp && !$product.quantity} <div class="out-of-stock-layer" style=" position: absolute; height: 100%; width: 100%; z-index: 1; background: rgba(1,1,1,0.2); pointer-events: none; "></div> {/if}

 

after "thumbnail-container"

 

Thanks to him