Change color of social icons in top bar

[mrdave7]

1.) It seems I can’t change the color of the social icons in top bar. I want to use a white top bar so you don’t see the white icons. Of course, if you hover and the color effect comes up you do see the icons. I tried to change style to ‘dark’ and to leave it out completely, doesn’t change anything…
Original [social size=’small’ style=’light’ type=’facebook,youtube,vimeo’]
1st version [social size=’small’ style=’dark’ type=’facebook,youtube,vimeo’]
2nd version [social size=’small’ type=’facebook,youtube,vimeo’]

2.) Can I change the color of the social icons? I don’t facebook to be blue, youtube to be red, etc, but I would prefer to have all with the same hover color.

3.) I would love to have a small divider between top bar and Navi to get a similar effect like you have done with the 2 line headers. How could I do that? 1 px line grey…

Thx for your help.

[mrdave7]

This reply has been marked as private.

[Swift Ideas – Ed]

Hi there,

1) You could use the following custom css:

ul.social-icons li:not(.sf-love) a {
color: #222!important;
}

2) If you want them all to have the same hover bg colour, you can use the following custom css:

ul.social-icons li a:hover {
background: #222!important;
}

3) You can use the following custom css:

#top-bar {
border-bottom: 1px solid #e3e3e3;
}

Hope that helps!

– Ed

[mrdave7]

Oh great, thank you so much. Working just fine 🙂

[Swift Ideas – Ed]

You’re welcome!

– Ed