The share options pattern allows links to be shared across social media platforms.
<!-- Begin pattern: share-options //-->
<div id="share-options">
<ul>
<li><a href="#"><span class="sr-only">Facebook</span>
<i class="fa fa-facebook-square fa-2x" title="Facebook" aria-hidden="true"></i>
</a></li>
<li><a href="#"><span class="sr-only">Twitter</span>
<i class="fa fa-twitter-square fa-2x" title="Twitter" aria-hidden="true"></i>
</a></li>
<li><a href="#"><span class="sr-only">Facebook Messenger</span>
<svg version="1.1" id="Messenger_Mark" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 1000 1000" xml:space="preserve"><path id="Bubble_Shape" class="st0" d="M501,0C227.6,0,6,207.2,6,462.8c0,145.4,71.7,275.2,183.9,360V1000l168.9-93.7 c45,12.6,92.8,19.4,142.2,19.4c273.4,0,495-207.2,495-462.8S774.3,0,501,0z M553.1,620.7l-128-133L178.5,624l270.3-286.8l128,133 l246.5-136.3L553.1,620.7z"></path></svg>
</a></li>
<li><a href="#"><span class="sr-only">LinkedIn</span>
<i class="fa fa-linkedin-square fa-2x" title="LinkedIn" aria-hidden="true"></i>
</a></li>
<li class="visible-xs"><a href="#"><span class="sr-only">WhatsApp</span>
<i class="fa fa-whatsapp fa-2x" title="WhatsApp" aria-hidden="true"></i>
</a></li>
<li><a href="#"><span class="sr-only">Email</span>
<i class="fa fa-envelope fa-2x" title="Email" aria-hidden="true"></i>
</a></li>
</ul>
</div>
<!-- End pattern: share-options //-->