How can I add a hover effect to my homepage logo list?

Store Design
1

Hello experts!!! :slightly_smiling_face:

How to add a hover effect on the logo list we have on the homepage?

Please check: https://www.nninspirationalgifts.com/

Logo list are the “Inspirational”, “Personal”… etc

Thank you!

1 Like
2 
.image-element__wrap:hover {
    opacity: 0.3 !important;
}

@KatFuentes

Add this code in the bottom of the style.css or style.scss file
or follow this:

  1. Navigate to Online Store->Theme->Edit code
  2. Asset->/style.css ->paste above code at the bottom of the file.
  3. Save it.
3

Thanks Zworthkey! :slightly_smiling_face:

But it applied to ALL elements on the homepage. Is it possible to apply
this for the Logo List alone?

4

Did you solve this problem now?

5

Not yet.

The hover effect was applied to all elements.

Hoping someone could help me apply the hover on the logo list alone :slightly_smiling_face:

6 
.logo-bar__item.image-element__wrap:hover {
    opacity: 0.3 !important;
}

@KatFuentes
try this code and remove previous one.

7

Thank you!
But, no hover on the logo list :disappointed_face:

8 
.logo-bar__item:hover {
    opacity: 0.3 !important;
}

@KatFuentes

try this.

9

GENIUS!!!

Thanks you Zworthkey :slightly_smiling_face:

1 Like
10

Hi,

Can I ask where I should add it?

I have the Debut theme and don’t have a style.css asset

Thanks!