<div class="table-responsive">
    <table class="talk-event-table table table-striped">
        <thead>
            <tr>
                <th class="date">Date</th>
                {% if show_talk %}<th>Talk</th>{% endif %}
                <th>Event</th>
                <th class="feedback">Feedback</th>
            </tr>
        </thead>
        <tbody>
            {% set events = reverse_order ? events|sortbyfield('date')|reverse : events|sortbyfield('date') %}
            {% for event in events %}
                <tr>
                    <td class="date">
                        {{ event.date|date('j F Y') }}
                    </td>

                    {% if show_talk %}
                        <td>
                            <a href="{{ event.talk.url }}">
                                {{ event.talk.title }}
                            </a>

                            {% if event.talk.type %}
                                <small class="talk-type">
                                    {{ event.talk.type }}
                                </small>
                            {% endif %}
                        </td>
                    {% endif %}

                    <td>
                        {% if event.url %}<a href="{{ event.url }}">{% endif %}
                        {{ event.title }}
                        {% if event.url %}</a>{% endif %}

                        {% if event.location %}
                            <small class="event-location">
                                {{- event.location -}}
                            </small>
                        {% endif %}
                    </td>

                    <td class="feedback">
                        {% if event.talk.joindin %}
                            <a href="{{ event.talk.joindin }}" class="btn btn-primary" title="Read or leave feedback for this talk">
                                <i class="fa fa-comment-o"></i> joind.in
                            </a>
                        {% endif %}
                    </td>
                </tr>
            {% endfor %}
        </tbody>
    </table>
</div>