Social Icons Link and Highlight Colors not Working

My social icon link and highlight colors are not working on my published page in Safari. The YouTube icon works fine in Chrome and Firefox. The YouTube icon in my RW project preview shows the link and highlight colors, the Facebook icon shows neither, and you can see how they appear on the web:
http://www.lash-it.com

Can you suggest a fix please?

@bruce

The Facebook icon doesn’t have a hover colour in Chrome, Firefox nor Safari for me, but the YouTube does. Did you forget to set the hover colour for the Facebook icon (if you are doing it by fa fa-)?

In the responsive.css file, there is a typo on line 1865 (o verflow should be overflow) - might be a Theme issue, report to developer.

Did you check for the latest version of the Theme and mark all pages as changed and re-publish?

Other than that, nice use of the Lode Theme!

Brad

@Turtle, Thanks for the compliment. I’ll let Multithemes know about you code error finding. I did have the Font Awesome code goofed a bit on both social icons. I’m pretty sure that’s fixed now, and the link color works, but the hover color still does not work in Safari. I deleted all the files from the FTP and republished, no change.

I’ve yet to figure out how I check to see if I have the current version of a theme. Is there a way to do it in RW?

@bruce, doesn’t look like MultiThemes supports Nimblehosts Waterfall (Theme updater for supported themes from supported dev’s, more info here), so you will have to go to MultiThemes website and manually check for updates, same for Nick Cates Design. Sometimes the RapidWeaver Community site has the latest version available for download but that is not always the case unfortunately.

As an aside
I wish… developers would send out a newsletter when they update Themes, Plugins and stacks, especially those that don’t keep the RapidWeaver community site updated or don’t have their stuff on the RapidWeaver community. I don’t sign up for newsletters just to get discounts after all lol

Brad

Looks like you have it all sorted out now @bruce, hover colours work on your social icons in Safari.

Brad

@Turtle, The social icon hover colors are not showing when I view the page in Safari 9.0.2, OSX 10.11.2.

@bruce

Cache issue perhaps?

I’m on public beta 1 of OSX, so the version of Safari is slightly different. The normal colour is a medium to dark gray, the hover colour is a dark blue that I see for both social icons.

Brad

@Turtle. That did it! I cleared the cache, and now the hover color appears. Thanks.

1 Like

HI @bruce

The Awesome icon is a text and inherits the same behavior of the regular hyperlink.
Maybe it’s a problem of overlap, it may be too close to the edge, try to move both icons a bit more to the right

I made some classes dedicated to social icons made with Awesome font in the Plus code, you can set the right color.

<i class="fa fa-twitter fa-box-twitter fa-max-30"></i> 
<i class="fa fa-facebook fa-box-facebook fa-max-30"></i> 
<i class="fa fa-youtube fa-box-youtube fa-max-30"></i> 
<i class="fa fa-pinterest fa-box-pinterest fa-max-30"></i>

note: put both links in the same line and use this space between icons: &nbsp;

&nbsp; &nbsp; <i class="fa fa-facebook fa-box-facebook fa-max-30"></i> &nbsp; <i class="fa fa-youtube fa-box-youtube fa-max-30"></i>

hope this helps

thanks! this is a typo mistake, sorry; in any case it does not affect the animation “beat”
I’ve updated the theme.

1 Like