How can I change the opacity with a hover effect for a container?

Store Design
1

Hey guys!

For better understanding of my question, here a picture first:

Product_container.jpg
Product_container.jpg850×744 35 KB

I would like to change the opacity of this container with a hover effect, meaning when I hover over this container, the opacity of the picture, title and price change. For some reason, I’m not able to find this container anywhere in the code, but maybe you have a solution to this.

My store: https://fitness-sleeves.myshopify.com/ PW: ohthau

2

If you want to change the opacity for the whole product card container, you could just add this code to the CSS at the end of file theme.css

.grid-view-item.product-card:hover {
    opacity: 0.5;
}
3

hello @dano3333

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

#shopify-section-collection .grid-view-item.product-card:hover {
    opacity: 0.5;
}
4

Thank you!