members.njk

---
layout: layouts/home.njk
title: Virtual Coffee Members
description: Meet our amazing members!
---

<div class="py-4">
  <div class="container">
    <div class="row align-items-center">
      <div class="col-sm-4">
        {% include "svg/undraw_team_spirit_hrr4.svg" %}
      </div>
      <div class="col-sm-8">
        <h1 class="display-4">Virtual Coffee Members</h1>
        <p class="lead ">A community is only as awesome as its members!</p>
      </div>
    </div>
  </div>
</div>

<div class="bg-light py-5">
  <div class="container-xl">
    <h2 class="mb-sm-3 mb-md-5 display-4">Our Founders</h2>
    <div class="membercards">
      {% for founder in founders %}
        <div class="row membercard">
          <div class="col-3">
            <img src="{{founder.avatar_url}}" class="shadow-sm rounded" alt="{{founder.name}} profile image">
          </div>
          <div class="col-9">
            <div class="membercard-header">
              <h5>
                {% if founder.blog %}
                  <a href="{{founder.blog}}" target="_blank" rel="noopener noreferrer">{{founder.name}}</a>
                {% else %}
                  {{founder.name}}
                {% endif %}

              </h5>
              <div class="membercard-social">
                {% if founder.hireable %}
                  {% if founder.blog %}
                    <a href="{{founders.blog}}" class="badge badge-secondary">Available for work!</a>
                  {% else %}
                    <span class="badge badge-secondary">Hireable!</span>
                  {% endif %}
                {% endif %}

                <a href="{{founder.html_url}}" class="membercard-icon" title="{{founder.login}} on GitHub" target="_blank" rel="noopener noreferrer">{% include "svg/github.svg" %}</a>
                {% if founder.twitter_username %}
                  <a href="https://twitter.com/{{founder.twitter_username}}" title="{{founder.twitter_username}} on Twitter" class="membercard-icon" target="_blank" rel="noopener noreferrer">{% include "svg/twitter.svg" %}</a>
                {% endif %}
              </div>
            </div>
            <p class="text-muted">{{founder.bio}}</p>
            {% if founder.blog %}
              <div>
                <a href="{{founder.blog}}" target="_blank" rel="noopener noreferrer">{{founder.blog | replace('https://','') | replace('http://','')}}</a>
              </div>
            {% endif %}
          </div>
        </div>
      {% endfor %}
    </div>

    <div class="bg-light py-5">
      <div class="container-xl">
        <h2 class="mb-sm-3 mb-md-5 display-4">Our Members</h2>
        <div class="membercards">
          {% for member in members %}
            <div class="row membercard">
              <div class="col-3">
                <img src="{{member.avatar_url}}" class="shadow-sm rounded" alt="{{member.name}} profile image">
              </div>
              <div class="col-9">
                <div class="membercard-header">
                  <h5>
                    {% if member.blog %}
                      <a href="{{member.blog}}" target="_blank" rel="noopener noreferrer">{{member.name}}</a>
                    {% else %}
                      {{member.name}}
                    {% endif %}

                  </h5>
                  <div class="membercard-social">
                    {% if member.hireable %}
                      {% if member.blog %}
                        <a href="{{members.blog}}" class="badge badge-secondary">Available for work!</a>
                      {% else %}
                        <span class="badge badge-secondary">Available for work!</span>
                      {% endif %}
                    {% endif %}

                    <a href="{{member.html_url}}" class="membercard-icon" title="{{member.login}} on GitHub" target="_blank" rel="noopener noreferrer">{% include "svg/github.svg" %}</a>
                    {% if member.twitter_username %}
                      <a href="https://twitter.com/{{member.twitter_username}}" title="{{member.twitter_username}} on Twitter" class="membercard-icon" target="_blank" rel="noopener noreferrer">{% include "svg/twitter.svg" %}</a>
                    {% endif %}
                  </div>
                </div>
                <p class="text-muted">{{member.bio}}</p>
                {% if member.blog %}
                  <div>
                    <a href="{{member.blog}}" target="_blank" rel="noopener noreferrer">{{member.blog | replace('https://','') | replace('http://','')}}</a>
                  </div>
                {% endif %}
              </div>
            </div>
          {% endfor %}
        </div>

        <div class="p-sm-1 p-sm-2 p-md-3 member-footer">
          <h2 class="mb-sm-3 mb-md-5 display-4">Go Team!</h2>
          {% include "svg/undraw_celebration_0jvk.svg" %}
        </div>
      </div>
    </div>