How to change hover design on gallery images - Debut theme

Store Design
1

Hi there,

I’ve looked at a few discussions similar to this, but couldn’t find a solution that worked for me. Currently, my gallery images on my site’s home page have text overlay and when you hover, the images turn dark grey. I want to change it so instead of hovering and they turn grey, the text is revealed.

So I don’t want the images to have the text overlay until you hover them. Any help is greatly appreciated! Here’s the URL: https://smokingguncoffee.com/

Here’s an image for more context:

hover icons.PNG
hover icons.PNG1889×860 194 KB

Thanks so much!

2

Hi,

Try adding this code to the bottom of theme.scss.css (or theme.css)

@media only screen and (min-width: 750px) {
.image-bar__caption {
visibility: hidden;
}
.image-bar__content.image-bar__overlay:hover .image-bar__caption {
  visibility: visible;
}
}