{% assign exec = include.exec %}
<div class="executive">
  <h2>
    {{ exec.name }} -
    {% case exec.role %}
      {% when "president" %} President
      {% when "vice-president" %} Vice President
      {% when "secretary" %} Secretary
      {% when "treasurer" %} Treasurer
      {% when "webmaster" %} Webmaster
      {% when "education-chair" %} Education and Conferences Chair
      {% when "outreach-chair" %} Outreach and Public Relations chair
      {% when "membership-chair" %} Membership Chair
    {% endcase %}
  </h2>
  <img src="/assets/{{ exec.role }}.jpg" alt="{{ exec.role }}" onerror="this.style.display='none'"/>
  <div>
    <div style="display: inline-block">
      <img
        class="icon"
        src="/assets/email.png"
        alt="" />
      <a href="mailto:{{exec.email}}">{{ exec.email }}</a>
    </div>

    {% if exec.github %}
      <div style="display: inline-block">
        <img
          class="icon"
          src="/assets/github-circle.png"
          alt="" />
        <a href="https://github.com/{{ exec.github }}">{{ exec.github }}</a>
      </div>
    {% endif %}

    {% if exec.linkedin %}
      <div style="display: inline-block">
        <img
          class="icon"
          src="/assets/linkedin-logo.png"
          alt="" />
        <a href="https://linkedin.com/in/{{ exec.linkedin }}">{{ exec.name }}</a>
      </div>
    {% endif %}

    {% if exec.twitter %}
      <div style="display: inline-block">
        <img
          class="icon"
          src="/assets/twitter.png"
          alt="" />
        <a href="https://twitter.com/{{ exec.twitter }}">{{ exec.twitter }}</a>
      </div>
    {% endif %}

    {% if exec.website %}
      <div style="display: inline-block">
        <img class="icon" src="/assets/link-variant.png" />
        <a href="{{exec.website}}">{{ exec.website }}</a>
      </div>
    {% endif %}
  </div>
  {% if exec.bio %}
    <p>{{ exec.bio }}</p>
  {% endif %}
</div>