Skip to content

Instantly share code, notes, and snippets.

@z-------------
Created May 17, 2015 11:11
Show Gist options
  • Save z-------------/8b32dd069285f64ed6be to your computer and use it in GitHub Desktop.
Save z-------------/8b32dd069285f64ed6be to your computer and use it in GitHub Desktop.
Sassy dryness
.banner-link.hasicon.twitter:before {
background-image: url(/assets/img/contact/twitter-color.svg); }
.banner-link.hasicon.twitter[href]:hover:before {
background-image: url(/assets/img/contact/twitter-white.svg); }
.banner-link.hasicon.facebook:before {
background-image: url(/assets/img/contact/facebook-color.svg); }
.banner-link.hasicon.facebook[href]:hover:before {
background-image: url(/assets/img/contact/facebook-white.svg); }
.banner-link.hasicon.email:before {
background-image: url(/assets/img/contact/email-color.svg); }
.banner-link.hasicon.email[href]:hover:before {
background-image: url(/assets/img/contact/email-white.svg); }
.banner-link.hasicon.whatsapp:before {
background-image: url(/assets/img/contact/whatsapp-color.svg); }
.banner-link.hasicon.whatsapp[href]:hover:before {
background-image: url(/assets/img/contact/whatsapp-white.svg); }
@each $medium in twitter, facebook, email, whatsapp {
&.#{$medium} {
&:before {
background-image: url(/assets/img/contact/#{$medium}-color.svg);
}
&[href]:hover:before {
background-image: url(/assets/img/contact/#{$medium}-white.svg);
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment