events.html

---
layout: page
title: Events
permalink: /events/
---
<div class="header-card">
  <div class="fixed-width">
    <h1>Events</h1>
  </div>
</div>
<div class="main">
  <div class="fixed-width">
    <div class="card thin-card">
      <ul class="event-listing">
          <li class="row event-header">
            <div class="column d-12-12 l-3-12 event-name">Name</div>
            <div class="column d-12-12 l-2-12">Type</div>
            <div class="column d-12-12 l-3-12">Date and time</div>
            <div class="column d-12-12 l-4-12">Location</div>
          </li>
          {% assign sorted = site.events | sort: 'date' %}
          {% for event in sorted reversed %}
          {% if event.date > site.time and event.cancelled != true %}
          <li class="row">
          {% else %}
          <li class="row past-event">
          {% endif %}
            <div class="column d-12-12 l-3-12 event-name">
              <a href="{{ event.url | prepend: site.baseurl }}">{{ event.title }}</a>
            </div>
            <div class="column d-12-12 l-2-12"><span class="tag tag-{{ event.type }}">{{ event.type }}</span></div>
            <div class="column d-12-12 l-3-12">
              {% comment %}
              {# Changing the format here? Also change the event page and the localise_times function #}
              {% endcomment %}
              {% include datetime.html date_only_format='%e %B %Y' datetime_format='%e %B %Y at %l%P' time_only_format = '%l%P' event=event %}
            </div>
            <div class="column d-12-12 l-4-12">{{ event.location }}</div>
          </li>
          {% endfor %}
      </ul>
      </div>
  </div>
</div>

<script type="text/javascript" defer>
  // function is defined in js/localise-times.js
  window.addEventListener('load', function() {
    localise_times('{{ site.timezone }}');
  });
</script>