site/_src/_includes/team.html

124 lines
5.2 KiB
HTML

<div class="grid grid--full grid-small--half grid-medium--third grid-large--columns text-center grid--founders">
{% assign founders = site.data.team.founders %}
{% for member in founders %}
<div class="grid__col">
<article class="team">
{% if member.image %}
{% assign image = member.image %}
{% else %}
{% assign image = 'wrigley-avatar.svg' %}
{% endif %}
<img class="team__image" src="/assets/img/team/{{ image }}">
<h1 class="team__name">{{ member.name }}</h1>
<p class="team__position">{{ member.position }}</p>
<p class="team__social">
{% if member.twitter %}
<a class="team__social__link" href="https://twitter.com/{{ member.twitter }}">
<svg class="icon icon--social icon--twitter" aria-labelledby="title">
<title>Twitter</title>
<use xlink:href="/assets/img/sprite.svg#twitter"></use>
</svg>
</a>
{% endif %}
{% if member.facebook %}
<a class="team__social__link" href="https://facebook.com/{{ member.facebook }}">
<svg class="icon icon--social icon--facebook" aria-labelledby="title">
<title>Facebook</title>
<use xlink:href="/assets/img/sprite.svg#facebook"></use>
</svg>
</a>
{% endif %}
{% if member.github %}
<a class="team__social__link" href="https://github.com/{{ member.github }}">
<svg class="icon icon--social icon--github" aria-labelledby="title">
<title>GitHub</title>
<use xlink:href="/assets/img/sprite.svg#github"></use>
</svg>
</a>
{% endif %}
{% if member.linkedin %}
<a class="team__social__link" href="https://www.linkedin.com/in/{{ member.linkedin }}">
<svg class="icon icon--social icon--linkedin" aria-labelledby="title">
<title>LinkedIn</title>
<use xlink:href="/assets/img/sprite.svg#linkedin"></use>
</svg>
</a>
{% endif %}
</p>
<div class="team__bio">{{ member.bio | markdownify }}</div>
</article>
</div>
{% endfor %}
</div>
<div class="team__bio__trigger"><span>+</span>Show bios</div>
<div class="grid grid--full grid-small--half grid-medium--third grid-large--columns grid--gutters text-center grid--team">
{% assign team = site.data.team.team | sort: 'name' %}
{% for member in team %}
<div class="grid__col grid__col--2">
<article class="team">
{% if member.image %}
{% assign image = member.image %}
{% else %}
{% assign image = 'wrigley-avatar.svg' %}
{% endif %}
<img class="team__image" src="/assets/img/team/{{ image }}">
<h1 class="team__name">{{ member.name }}</h1>
<p class="team__position">{{ member.position }}</p>
<p class="team__social">
{% if member.twitter %}
<a class="team__social__link" href="https://twitter.com/{{ member.twitter }}">
<svg class="icon icon--social icon--twitter" aria-labelledby="title">
<title>Twitter</title>
<use xlink:href="/assets/img/sprite.svg#twitter"></use>
</svg>
</a>
{% endif %}
{% if member.facebook %}
<a class="team__social__link" href="https://facebook.com/{{ member.facebook }}">
<svg class="icon icon--social icon--facebook" aria-labelledby="title">
<title>Facebook</title>
<use xlink:href="/assets/img/sprite.svg#facebook"></use>
</svg>
</a>
{% endif %}
{% if member.github %}
<a class="team__social__link" href="https://github.com/{{ member.github }}">
<svg class="icon icon--social icon--github" aria-labelledby="title">
<title>GitHub</title>
<use xlink:href="/assets/img/sprite.svg#github"></use>
</svg>
</a>
{% endif %}
{% if member.linkedin %}
<a class="team__social__link" href="https://www.linkedin.com/in/{{ member.linkedin }}">
<svg class="icon icon--social icon--linkedin" aria-labelledby="title">
<title>LinkedIn</title>
<use xlink:href="/assets/img/sprite.svg#linkedin"></use>
</svg>
</a>
{% endif %}
</p>
</article>
</div>
{% endfor %}
</div>