{% 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 }}
    </a>

{% endfor %}

{% endblock program_content %}