Затемнить фото товара которого нет в наличии

[Ch0oJoy 17]

Подскажите пожалуйста как можно затемнить/высветлить изображения товара которого нет в наличии. Раньше был модификатор, Gray Image, но версия ос не подходит(

[sasha3337774 18]

.stock-false{
filter: grayscale(100%);
}

например вот так затемнить
http://joxi.ru/KAglQOaTNYd4yr

а вот так высветлить:

.stock-false{
opacity: .3;
}

http://joxi.ru/V2Vyq89S8Noxbm

Edited Wednesday at 10:22 PM by sasha3337774

[SGrWr_34 5]

еще нужно в контроллере в массив товаров добавить

'quantity'        => $result['quantity'],

а в каталоге, поиске и так далее изменить вывод картинки пример так

<img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive {% if product.quantity <= 0 %}stock-false{% endif %}" />

 

[matroskin92 95]

Именно для обесцвечивания надо использовать не opacity (это прозрачность), а 

filter: grayscale(100%);

Тогда получите серую картинку

[Ch0oJoy 17]

5 часов назад, SGrWr_34 сказал:

еще нужно в контроллере в массив товаров добавить

'quantity'        => $result['quantity'],

а в каталоге, поиске и так далее изменить вывод картинки пример так

<img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive {% if product.quantity <= 0 %}stock-false{% endif %}" />

 

 

<a href="{{ product['href'] }}"><img {% if (product['product_quantity'] <= 0 and show_stock_status) %}data-status="{{ product['stock_status'] }}"{% endif %} {% if (lazyload_page) %}data-src="{{ product['thumb'] }}" src="{{ lazy_image }}" {% else %}src="{{ product['thumb'] }}"{% endif %} alt="{{ product['name'] }}" title="{{ product['name'] }}" class="img-responsive {% if (lazyload_page) %}lazyload{% endif %}" class="img-responsive {% if product.quantity <= 0 %}stock-false{% endif %}"/></a>

Подскажите пожалуйста, так?

[SGrWr_34 5]

@Ch0oJoy , странный у вас синтаксис, используйте стандартный twig. {{ product.href }} вместо {{ product['href' }} и т.д.

И неправильно дважды задавать класс -> в таком случае будет использоваться последний. В вашем случае строка должна быть примерно такая:

<a href="{{ product.href }}"><img {% if (product.product_quantity <= 0 and show_stock_status) %}data-status="{{ product.stock_status }}"{% endif %} {% if (lazyload_page) %}data-src="{{ product.thumb }}" src="{{ lazy_image }}" {% else %}src="{{ product.thumb }}"{% endif %} alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive {% if (lazyload_page) %}lazyload{% endif %}{% if product.quantity <= 0 %} stock-false{% endif %}" /></a>