{% extends 'program_base.html' %}

{% block program_content %}
<h2>{{ date|date:"l, F jS" }}</h2>
{% for event in events %}

  {% ifchanged event.event_type %}

    {% if not forloop.first %}</div>{% endif %}
    <h3>{{ event.event_type }}</h3>
    <div style="display: flex; flex-wrap: wrap;">

  {% endifchanged %}

    <a class="event"
         href="{% url 'schedule:event' slug=event.slug %}"
         style="background-color: {{ event.event_type.color }}; border: 0; color: {% if event.event_type.light_text %}white{% else %}black{% endif %};">
      <small>{{ event.start|date:"H:i" }} - {{ event.end|date:"H:i" }}</small>
      <br />
      {{ event }}
      <br />
      {% if event.speakers.exists %}
        by {{ event.speakers.all|join:", " }}
      {% endif %}
    </a>

{% endfor %}
</div>

{% endblock program_content %}