Customizing Review Widget Arrow

Ask the Community Customization
1

image
image466×191 6.29 KB

I’m using the All-in-One Reviews widget and trying to change the white glow/gradient that shows up next to the scroll arrow (.es-tabs-slider-arrow-right / .es-tabs-slider-arrow-left).

I want to keep the arrow but change the color or style of the glow. I can’t find the CSS that controls it. So far I’ve just been hiding .es-tabs-slider-arrow, which also removes the glow/gradient, but I’m trying to customize the color instead of it just being white.

Anyone know how to do this?

2 Likes
3

Hi there and welcome to the Community, @Sam_S :waving_hand:

This code should help:

.es-tabs-slider-arrow-left:before {
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(255, 100, 255, 0.3) 50%);
}

.es-tabs-slider-arrow-right:before {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(255, 100, 255, 0.3) 50%);
}

Please try to add it to the Custom CSS field on the Style tab of your widget’s settings and let me know how it worked :slightly_smiling_face:

2 Likes
4

Thank you, that worked.

2 Likes
5

Great, you’re most welcome :wink: