"New behavior in Clients Display" (#3439735) / ThemeNectar

Comments

10
davidkhuffman started the conversation
August 18, 2023 at 7:07pm
This is really a feature request, or perhaps behavior change.
In the Clients Display Settings, there's a "Greyscale to Color" option in the "Hover Effect".
But, I'd love it if the Greyscale to Color happened in the carousel even when not hovering the cursor over the logo. E.g., when the logo is in the center position, it changes to Color.
Is there a CSS fix possible for this?
Thanks!
8,839
Tahir replied
August 18, 2023 at 7:38pm
Hey Again,
Yes, this should be possible with CSS. However, I can see only 4 items in the carousel so there is no center logo available?.

Thanks.

ThemeNectar Support Team
10
davidkhuffman replied
August 19, 2023 at 10:02pm
Fixed now:
there's now an odd number of logos (15)
and the Clients Display is set to 5 columns
8,839
Tahir replied
August 20, 2023 at 5:59pm
Hey Again,
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):

.clients.fade-in-animation.completed>div:nth-child(3n) img{ -webkit-filter: grayscale(0) !important; filter: grayscale(0) !important; opacity: 1 !important; }

Thanks
ThemeNectar Support Team
10
davidkhuffman replied
August 21, 2023 at 5:07pm
Thank you! That's awesome.
There's a tiny issue that I can live with, but if it were a trivial fix, then that'd be great.
http://davidh523.sg-host.com/#testimonials_logos
As the logo appears on the right, it is briefly opaque before going to grayscale.
Is that a function of the number of logos or the number of columns?
Any thoughts?

8,839

Tahir replied

August 21, 2023 at 5:30pm

Hey Again,

Try this CSS instead and check.

.clients>div:nth-child(3) img{
     -webkit-filter: grayscale(0) !important;
    filter: grayscale(0) !important;
    opacity: 1 !important;
}

Thanks

ThemeNectar Support Team

10
davidkhuffman replied
August 21, 2023 at 5:41pm
That fixed it.
Thank you!!
1 Like