Skip to content

Instantly share code, notes, and snippets.

@mariafromkorea

mariafromkorea/vrFusion Social Media Icons

Last active August 29, 2015 14:06
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save mariafromkorea/eef49cdd8523b2e7ea28 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save mariafromkorea/eef49cdd8523b2e7ea28 to your computer and use it in GitHub Desktop.
Download ZIP
New Social Icon Partial for vrFusion Sites
Raw
vrFusion Social Media Icons
//============================
// Social Icons - Footer
//============================
$social-layout: vertical;
$social-spacing: 0;
$social-gap_width: 0.5em; /* Set gap between icons */
$speed: 150ms;
.vrweb-social{
margin:0;
@media only screen and (max-width:emCalc(800)){
display:inline-block;
width:auto;
}
li{
@media #{$tiny}{
margin-left:8px;
}
&.first{
margin-left:0px;
}
a{
display:block;
width:34px;
height:34px;
background:url("../images/smicon-sprite.png");
background-repeat:no-repeat;
transition:opacity .35s ease-in-out;
text-indent:-999px;
opacity:1.0;
span{
display:block;
width:34px;
height:34px;
transition:opacity .35s ease-in-out;
background:url("../images/smicon-sprite.png");
opacity:0;
}
}
a:hover, a:active, a:focus{
span {
opacity:1.0;
}
}
}
li.instagram a{
background-position: 0px 0px;
span{
background-position:0px -34px;
}
}
li.facebook a{
background-position:-34px 0px;
span{
background-position:-34px -34px;
}
}
li.twitter a{
background-position:-68px 0px;
span{
background-position:-68px -34px;
}
}
li.linkedin a{
background-position:-102px 0px;
span{
background-position:-102px -34px;
}
}
li.google-plus a{
background-position:-136px 0px;
span{
background-position:-136px -34px;
}
}
li.pinterest a{
background-position:-170px 0px;
span{
background-position:-170px -34px;
}
}
li.youtube a{
background-position:-204px 0px;
span{
background-position:-204px -34px;
}
}
@media #{$tiny}{
display:inline-block;
li.first{
margin-left:0px;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment