Rollover color on X icons

Support
#1

Hello,
How could i add a rollover color on the 4 social x icons here ? (On page, not on the footer)

And same question for the button on the right.

#2

Hello @Lyser,

Thanks for asking. :slight_smile:

You can use background color property for button and color property for social icons to change their respective color. Here is the CSS selector you need to use.

For social icon CSS selector: i.x-icon:hover

For sidebar button CSS selector: .theiaStickySidebar a.x-btn.x-btn-flat:hover

After that all you need to do is use CSS to style those elements. I am sharing few links to help you get started.

https://www.w3schools.com/cssref/pr_text_color.asp
https://www.w3schools.com/css/css_background.asp

Thanks.

#3

Thank you !
Last thing, you can see that the icon in the button now take the hover color of the code, how can i make it stay white when i hover it ?
i tried a
.theiaStickySidebar a.x-btn.x-btn-flat .x-icon { color:#fff; }
but it don’t work

-EDIT-
Ok i just forgot the !important, the code is :
.theiaStickySidebar a.x-btn.x-btn-flat .x-icon { color:#fff !important; }

Everything’s fine thx a lot :slight_smile:

#4

Glad it’s okay now and you’re most welcome!