JattJames

<div class="social-buttons">
  <a href="#" class="social-button social-button--facebook" aria-label="Facebook">
    <i class="fab fa-facebook-f"></i>
  </a>
  <a href="#" class="social-button social-button--linkedin" aria-label="LinkedIn">
    <i class="fab fa-linkedin-in"></i>
  </a>
  <a href="#" class="social-button social-button--snapchat" aria-label="Snapchat">
    <i class="fab fa-snapchat-ghost"></i>
  </a>

JattJames

<div class="wrap">
  <div class="social">
    <i class="icon-facebook fb"></i>
    <i class="icon-twitter tw"></i>
    <i class="icon-youtube yt"></i>
    <i class="icon-dribble dr"></i>
    <i class="icon-skype sk"></i>
     <i class="icon-dropbox db"></i>
     <i class="icon-apple apple"></i>
  </div>

JattJames

.networks
  .netbox
    a(class="icon ion-social-facebook" href="#" data-tip="I share some interesting posts about Tech in FB!")
    a(class="icon ion-social-twitter"  href="#" data-tip="Wanna know when I'm cooking a new Codepen recipe? Follow me!")
    a(class="icon ion-social-github"   href="#" data-tip="I've written a lot of lines of code, take a look :)")
    a(class="icon ion-social-codepen"  href="#" data-tip="I do some Pens to have fun!")
    

JattJames

.networks
  .netbox
    a(class="icon ion-social-facebook" href="#" data-tip="I share some interesting posts about Tech in FB!")
    a(class="icon ion-social-twitter"  href="#" data-tip="Wanna know when I'm cooking a new Codepen recipe? Follow me!")
    a(class="icon ion-social-github"   href="#" data-tip="I've written a lot of lines of code, take a look :)")
    a(class="icon ion-social-codepen"  href="#" data-tip="I do some Pens to have fun!")