contact.html

<div class="md-flex mxn2">
  <div class="md-col-4 px2 mb3">
    {% include components/hr-muted.html %}
    <h2 class="bold mb3">Email</h2>
    <p class="h3 bold mb3 light line-height-3"> Currently the best way to get in contact is via email:</p>
    <hr class="white muted border-bottom m0">
    <div class="mb3">
      <h5 class="caps">The Leadership</h5>
      <h3 class="bold mt0">leadership@voteflux.org</h3>
      {% comment %} <h3 class="bold mt0">steerco@voteflux.org</h3> {% endcomment %}
    </div>
    <hr class="white muted border-bottom m0">
    <div class="mb3">
      <h5 class="caps">Media Enquiries</h5>
      <h3 class="bold mt0">media@voteflux.org</h3>
      <h3 class="bold mt0">media.wa@voteflux.org</h3>
    </div>
    <hr class="white muted border-bottom m0">
    <div class="mb3">
      <h5 class="caps">Campaign and Field Coordination</h5>
      <h3 class="bold mt0">campaign@voteflux.org</h3>
    </div>
  </div>
  <div class="md-col-4 px2 mb3">
    {% include components/hr-muted.html %}
    <h2 class="bold mb3">Social Media</h2>
    {% for social in site.social-media %}
      <hr class="white muted border-bottom m0">
      <div class="my2 flex">
        <div class="">
          <img src="{{site.baseurl}}/img/social-icons/{{social.name}}-with-circle.svg" alt="{{social.name}}" width="36" class="mr2" />
        </div>
        <h3 class="inline-block hover-show-child"><a href="{{ social.url }}" class="accent accent-on-hover transition-fast">{{ social.name | capitalize }}</a><i class="material-icons icon-adjust muted">call_made</i></h3>
      </div>
    {% endfor %}
  </div>

  <div class="md-col-4 px2 mb3">
    {% include components/hr-muted.html %}

    <h2 class="bold mt3 mb3">Volunteers Chat</h2>

      <div class="my2">
        <p class="h3 bold mb3 light line-height-3"> If you want to help us out with campaign efforts or otherwise, come and say hi on our Discord server. </p>
        <div class="hover-show-child">
          <a href="https://discord.io/FluxParty" class="h3 border-bottom">Join the chat!</a><i class="material-icons icon-adjust muted">call_made</i>
        </div>
      </div>

    {% include components/hr-muted.html %}

    <h2 class="bold mt3 mb3">Forum</h2>

    <div class="my2">
      <p class="h3 bold mb3 light line-height-3">(October 2020) We've started setting up a forum again. It's pretty raw atm but completely functional.</p>
      <div class="hover-show-child">
        <a href="https://forum.voteflux.org" class="h3 border-bottom">forum.voteflux.org</a><i class="material-icons icon-adjust muted">call_made</i>
      </div>
    </div>

  </div>
</div>