Component with widgets for social networks.
The code to generate the component is this:
<div class="widget-social-square mb-5">
<a class="facebook" href="#" target="_blank" title="Click here to access Facebook"><i class="fab fa-facebook-f"></i> 3000 <span>Fans</span></a>
<a class="twitter" href="#" target="_blank" title="Click here to access Twitter"><i class="fab fa-twitter"></i> 3000 <span>Followers</span></a>
<a class="telegram" href="#" target="_blank" title="Click here to access Telegram"><i class="fab fa-telegram-plane"></i> 1000 <span>Followers</span></a>
<a class="youtube" href="#" target="_blank" title="Click here to access YouTube"><i class="fab fa-youtube"></i> 3000 <span>Fans</span></a>
<a class="linkedin" href="#" target="_blank" title="Click here to access Linkedin"><i class="fab fa-linkedin"></i> 3000 <span>Followers</span></a>
<a class="rss" href="#" target="_blank" title="Click here to access the RSS"><i class="fa fa-rss"></i> 1000 <span>Followers</span></a>
<a class="instagram" href="#" target="_blank" title="Click here to access Instagram"><i class="fab fa-instagram"></i> 3000 <span>Fans</span></a>
<a class="whatsapp" href="#" target="_blank" title="Click here to share on WhatsApp"><i class="fab fa-whatsapp"></i> 3000 <span>Followers</span></a>
<a class="pinterest" href="#" target="_blank" title="Click here to access Pinterest"><i class="fab fa-pinterest"></i> 1000 <span>Followers</span></a>
</div>
<ul class="widget-social-buttons-small mb-5">
<li><a class="facebook" href="#" target="_blank" title="Click here to access Facebook"><i class="fab fa-facebook-f"></i></a></li>
<li><a class="twitter" href="#" target="_blank" title="Click here to access Twitter"><i class="fab fa-twitter"></i></a></li>
<li><a class="youtube" href="#" target="_blank" title="Click here to access YouTube"><i class="fab fa-youtube"></i></a></li>
<li><a class="linkedin" href="#" target="_blank" title="Click here to access Linkedin"><i class="fab fa-linkedin"></i></a></li>
<li><a class="rss" href="#" target="_blank" title="Click here to access the RSS"><i class="fa fa-rss"></i></a></li>
<li><a class="instagram" href="#" target="_blank" title="Click here to access Instagram"><i class="fab fa-instagram"></i></a></li>
<li><a class="whatsapp" href="#" target="_blank" title="Click here to share on WhatsApp"><i class="fab fa-whatsapp"></i></a></li>
<li><a class="pinterest" href="#" target="_blank" title="Click here to access Pinterest"><i class="fab fa-pinterest"></i></a></li>
<li><a class="telegram" href="#" target="_blank" title="Click here to access Telegram"><i class="fab fa-telegram-plane"></i></a></li>
</ul>
<div class="widget-social-bar mt-5 mb-5">
<a href="" target="_blank" class="facebook">
<div class="icone">
<i class="fab fa-facebook-f" aria-hidden="true"></i>
</div>
<div class="corpo">
<data value="267.662">267.662</data>
<span>Likes</span>
</div>
</a>
<a href="" target="_blank" class="twitter">
<div class="icone">
<i class="fab fa-twitter" aria-hidden="true"></i>
</div>
<div class="corpo">
<data value="532">532</data>
<span>Followers</span>
</div>
</a>
<a href="" target="_blank" class="youtube">
<div class="icone">
<i class="fab fa-youtube" aria-hidden="true"></i>
</div>
<div class="corpo">
<data value="3.650">3.650</data>
<span>Subscribers</span>
</div>
</a>
<a href="" target="_blank" class="linkedin">
<div class="icone">
<i class="fab fa-linkedin" aria-hidden="true"></i>
</div>
<div class="corpo">
<data value="19.684">19.684</data>
<span>Followers</span>
</div>
</a>
<a href="" target="_blank" class="instagram">
<div class="icone">
<i class="fab fa-instagram" aria-hidden="true"></i>
</div>
<div class="corpo">
<data value="6.650">6.650</data>
<span>Followers</span>
</div>
</a>
<a href="" target="_blank" class="rss">
<div class="icone">
<i class="fa fa-rss" aria-hidden="true"></i>
</div>
<div class="corpo">
<data value="263.468">263.468</data>
<span>Subscribers</span>
</div>
</a>
</div>