2.3 Elements.SocialCard Social Card
Toggle example guides Toggle HTML markup
Card with name and social media link of user.
Example
Markup: _elements/_socialCard.twig
<div class="socialCard">
<div class="socialCard-figure"><img class="socialCard-img" src="{{ img }}" alt=""/></div>
<h1 class="socialCard-title">
<span class="socialCard-firstName">{{ firstName }}</span>
<span class="socialCard-lastName">{{ lastName }}</span>
</h1>
<div class="socialCard-desc">
<p>
À votre service sur Twitter <a href="https://twitter.com/{{ twitterName }}">@{{ twitterName }}</a><br/>
et sur Github <a href="https://github.com/{{ githubName }}">@{{ githubName }}</a>.
</p>
{% if site is defined %}
<p><a href="{{ site.url }}">{{ site.name }}</a></p>
{% endif %}
</div>
</div>
Source:
_elements/_socialCard.scss
, line 1