<div class="inline-flex text-slate-500 sm:ml-auto sm:mt-0 mt-2 justify-center sm:justify-start <%- extra %>">
    <a class="mr-3 fadeIn hover:text-slate-700 dark:hover:text-slate-300" href="<%- share_link("facebook") %>" target="_blank"><%-icon('facebook')%></a>
    <a class="mx-3 fadeIn hover:text-slate-700 dark:hover:text-slate-300" href="<%- share_link("twitter") %>" target="_blank"><%-icon('twitter')%></a>
    <a class="mx-3 fadeIn hover:text-slate-700 dark:hover:text-slate-300" href="<%- share_link("reddit") %>" target="_blank"><%-icon('reddit')%></a>
    <a class="mx-3 fadeIn hover:text-slate-700 dark:hover:text-slate-300" href="<%- share_link("pinterest") %>" target="_blank"><%-icon('pinterest')%></a>
    <a class="mx-3 fadeIn hover:text-slate-700 dark:hover:text-slate-300" href="<%- share_link("linkedin") %>" target="_blank"><%-icon('linkedin')%></a>
    <a class="ml-3 fadeIn hover:text-slate-700 dark:hover:text-slate-300" href="<%- share_link("line") %>" target="_blank"><%-icon('line')%></a>
</div>