Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • October 13, 2015 at 12:05 pm #518007
    markgibbons243

    Hi awesome support team.

    A little while ago, we were given the below code to allow the social media links to permanently be the colour set when hovered. Please could we have the code for the rest of the social links and also email to a friend.

    #top #wrap_all .av-social-link-facebook a {
    background-color: #37589b !important;
    color: #fff !important;
    }

    #top #wrap_all .av-social-link-twitter a {
    background-color: #46d4fe !important;
    color: #fff !important;
    }

    Thank in advance!

    October 13, 2015 at 4:03 pm #518143
    Ismael

    Hey markgibbons243!

    Thank you for using Enfold.

    What are the social icons that you used? Please post the url here. You can find the social colors on css > layout.css:

    #top #wrap_all .av-social-link-rss:hover	   	 a{color:#fff; background-color:#ffa133; }
#top #wrap_all .av-social-link-facebook:hover  a{color:#fff; background-color:#37589b; }
#top #wrap_all .av-social-link-twitter:hover   a{color:#fff; background-color:#46d4fe; }
#top #wrap_all .av-social-link-mail:hover      a{color:#fff; background-color:#9fae37; }
#top #wrap_all .av-social-link-dribbble:hover  a{color:#fff; background-color:#e44885; }
#top #wrap_all .av-social-link-linkedin:hover  a{color:#fff; background-color:#419cca; }
#top #wrap_all .av-social-link-search:hover    a{color:#fff; background-color:#222222; }
#top #wrap_all .av-social-link-gplus:hover     a{color:#fff; background-color:#de5a49; }
#top #wrap_all .av-social-link-behance:hover   a{color:#fff; background-color:#008cfa; }
#top #wrap_all .av-social-link-flickr:hover    a{color:#fff; background-color:#ff0086; }
#top #wrap_all .av-social-link-forrst:hover    a{color:#fff; background-color:#234317; }
#top #wrap_all .av-social-link-myspace:hover   a{color:#fff; background-color:#000000; }
#top #wrap_all .av-social-link-tumblr:hover    a{color:#fff; background-color:#345574; }
#top #wrap_all .av-social-link-vimeo:hover     a{color:#fff; background-color:#31baff; }
#top #wrap_all .av-social-link-youtube:hover   a{color:#fff; background-color:#a72b1d; }
#top #wrap_all .av-social-link-pinterest:hover a{color:#fff; background-color:#cb2027; }
#top #wrap_all .av-social-link-skype:hover 	   a{color:#fff; background-color:#12a5f4; }
#top #wrap_all .av-social-link-instagram:hover a{color:#fff; background-color:#a67658; }
#top #wrap_all .av-social-link-five_100_px:hover a{color:#fff; background-color:#222222; }
#top #wrap_all .av-social-link-soundcloud:hover  a{color:#fff; background-color:#F76700; }
#top #wrap_all .av-social-link-xing:hover 	     a{color:#fff; background-color:#006567; }
#top #wrap_all .av-social-link-vk:hover 	   	 a{color:#fff; background-color:#597BA5; }
#top #wrap_all .av-social-link-reddit:hover 	 a{color:#fff; background-color:#FF4500; }

    If you want to change the “skype” color for example, just follow the pattern in the previous code then refer to the css above:

    #top #wrap_all .av-social-link-skype a {
background-color: #12a5f4 !important;
color: #fff !important;
}

    Best regards,
    Ismael

    October 14, 2015 at 11:23 am #518574
    markgibbons243

    Fantastic, thank you!!!!

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Social Links on Hover’ is closed to new replies.