[skynet]

Hello CatchTeam, it would be awesome to have an option to reverse social icons color from standard light grey to colored.
Actually when you move mouse hover light grey social icons they are colored with their original color, it would be good to show their original color instead light gray and when mouse hover colored it with the light grey. What do you think?

[Skandha]

@skynet: Since there isn’t an option to change the hover color of social links to light grey and default color to their original color for the time being. You will need to add some CSS Code to achieve it.
Go to => Appearance => Customize => Additional CSS and add the following Code.

.social-profile ul li.facebook a {
	background-position: 0 -44px;
}
.social-profile ul li.facebook a:hover,
.social-profile ul li.facebook a:focus {
	background-position: 0 0;
}
.social-profile ul li.twitter a {
	background-position: -44px -44px;
}
.social-profile ul li.twitter a:hover,
.social-profile ul li.twitter a:focus {
	background-position: -44px 0;
}
.social-profile ul li.rss a {
	background-position: -88px -44px;
}
.social-profile ul li.rss a:hover,
.social-profile ul li.rss a:focus {
	background-position: -88px 0;
}
.social-profile ul li.you-tube a {
	background-position: -132px -44px;
}
.social-profile ul li.you-tube a:hover,
.social-profile ul li.you-tube a:focus {
	background-position: -132px 0;
}
.social-profile ul li.linkedin a {
	background-position: -176px -44px;
}
.social-profile ul li.linkedin a:hover,
.social-profile ul li.linkedin a:focus {
	background-position: -176px 0;
}
.social-profile ul li.tumblr a {
	background-position: -220px -44px;
}
.social-profile ul li.tumblr a:hover,
.social-profile ul li.tumblr a:focus {
	background-position: -220px 0;
}
.social-profile ul li.viemo a {
	background-position: -264px -44px;
}
.social-profile ul li.viemo a:hover,
.social-profile ul li.viemo a:focus {
	background-position: -264px 0;
}
.social-profile ul li.slideshare a {
	background-position: -264px -44px;
}
.social-profile ul li.slideshare a:hover,
.social-profile ul li.slideshare a:focus {
	background-position: -264px 0;
}
.social-profile ul li.dribbble a {
	background-position: -308px -44px;
}
.social-profile ul li.dribbble a:hover,
.social-profile ul li.dribbble a:focus {
	background-position: -308px 0;
}
.social-profile ul li.my-space a {
	background-position: -352px -44px;
}
.social-profile ul li.my-space a:hover,
.social-profile ul li.my-space a:focus {
	background-position: -352px 0;
}
.social-profile ul li.aim a {
	background-position: -396px -44px;
}
.social-profile ul li.aim a:hover,
.social-profile ul li.aim a:focus {
	background-position: -396px 0;
}
.social-profile ul li.myspace a {
	background-position: -352px -44px;
}
.social-profile ul li.myspace a:hover,
.social-profile ul li.myspace a:focus {
	background-position: -352px 0;
}
.social-profile ul li.flickr a {
	background-position: -440px -44px;
}
.social-profile ul li.flickr a:hover,
.social-profile ul li.flickr a:focus {
	background-position: -440px 0;
}
.social-profile ul li.pinterest a {
	background-position: -484px -44px;
}
.social-profile ul li.pinterest a:hover,
.social-profile ul li.pinterest a:focus {
	background-position: -484px 0;
}
.social-profile ul li.google-plus a {
	background-position: -528px -44px;
}
.social-profile ul li.google-plus a:hover,
.social-profile ul li.google-plus a:focus {
	background-position: -528px 0;
}
.social-profile ul li.wordpress a {
	background-position: -572px -44px;
}
.social-profile ul li.wordpress a:hover,
.social-profile ul li.wordpress a:focus {
	background-position: -572px 0;
}
.social-profile ul li.deviantart a {
	background-position: -616px -44px;
}
.social-profile ul li.deviantart a:hover,
.social-profile ul li.deviantart a:focus {
	background-position: -616px 0;
}
.social-profile ul li.slideshare a {
	background-position: -660px -44px;
}
.social-profile ul li.slideshare a:hover,
.social-profile ul li.slideshare a:focus {
	background-position: -660px 0;
}
.social-profile ul li.instagram a {
	background-position: -704px -44px;
}
.social-profile ul li.instagram a:hover,
.social-profile ul li.instagram a:focus {
	background-position: -704px 0;
}
.social-profile ul li.skype a {
	background-position: -748px -44px;
}
.social-profile ul li.skype a:hover,
.social-profile ul li.skype a:focus {
	background-position: -748px 0;
}
.social-profile ul li.soundcloud a {
	background-position: -792px -44px;
}
.social-profile ul li.soundcloud a:hover,
.social-profile ul li.soundcloud a:focus {
	background-position: -792px 0;
}
.social-profile ul li.email a {
	background-position: -837px -44px;
}
.social-profile ul li.email a:hover,
.social-profile ul li.email a:focus {
	background-position: -837px 0;
}
.social-profile ul li.xing a {
	background-position: -882px -44px;
}
.social-profile ul li.xing a:hover,
.social-profile ul li.xing a:focus {
	background-position: -882px 0;
}
.social-profile ul li.specificfeeds a {
	background-position: -927px -44px;
}
.social-profile ul li.specificfeeds a:hover,
.social-profile ul li.specificfeeds a:focus {
	background-position: -927px 0;
}
.social-profile ul li.meetup a {
	background-position: -971px -44px;
}
.social-profile ul li.meetup a:hover,
.social-profile ul li.meetup a:focus {
	background-position: -971px 0;
}
.social-profile ul li.goodreads a {
	background-position: -1015px -44px;
}
.social-profile ul li.goodreads a:hover,
.social-profile ul li.goodreads a:focus {
	background-position: -1015px 0;
}
.social-profile ul li.github a {
	background-position: -1059px -44px;
}
.social-profile ul li.github a:hover,
.social-profile ul li.github a:focus {
	background-position: -1059px 0;
}
.social-profile ul li.vk a {
	background-position: -1103px -44px;
}
.social-profile ul li.vk a:hover,
.social-profile ul li.vk a:focus {
	background-position: -1103px 0;
}

Let me know if this works!

Regards,
Skandha

[skynet]

Thank you very much! Work perfect, think about to add such feature in the future release of Catchbox Pro, love it!

[Skandha]

@skynet: Glad it worked out! Thank you for your suggestion. Have a good day!

Regards,
Skandha

[Author]

Posts