Example
Markup: components/social/social-following.twig
<div class="footer__social-links bg--black">
<ul>
<li>
<a href="https://www.facebook.com/officialrednoseday" title="Facebook" target="_blank" class="icon__fb">
<svg class="icon">
<use xlink:href="#icon-facebook"></use>
</svg>
</a>
</li>
<li>
<a href="https://twitter.com/rednoseday" title="Twitter" target="_blank" class="icon__twitter">
<svg class="icon">
<use xlink:href="#icon-twitter"></use>
</svg>
</a>
</li>
<li>
<a href="https://www.instagram.com/rednoseday/" title="YouTube" target="_blank" class="icon__youtube">
<svg class="icon">
<use xlink:href="#icon-youtube"></use>
</svg>
</a>
</li>
<li>
<a href="https://plus.google.com/+rednoseday" title="Instagram" target="_blank" class="icon__instagram">
<svg class="icon">
<use xlink:href="#icon-instagram"></use>
</svg>
</a>
</li>
<li>
<a href="https://www.youtube.com/user/rednoseday" title="Google Plus" target="_blank" class="icon__googleplus">
<svg class="icon">
<use xlink:href="#icon-googleplus"></use>
</svg>
</a>
</li>
</ul>
</div>
Source:
_shop18-styleguide.scss
, line 494