<!-- {% if page.headline.size > 0 %}
  <h2 class="mb-3">{{ page.headline }}</h2>
{% endif %}

<div id="content">
  {% if page.calendar.content.size > 0 %}
    <div id="intro" class="intro">
      {{ page.calendar.content }}
    </div>
  {% endif %}

  {% if page.calendar.is_proximity? %}
    <div class="mb-4">
      <div class="card">
        <h4 class="card-header">Find {{ page.calendar.event_name | pluralize | downcase }} near you</h4>
        <div class="card-body">
          {% form_for address_change %}
            <div class="form-wrap">
              <div class="form">

                <div class="form-group">
                  {% text_field "submitted_address", class:"form-control text", placeholder:"Address or postal code" %}
                </div>

                <div class="form-group distance">
                  <span class="mr-2 within">within</span>
                  <span class="radio-inline">{{ page.calendar.distance_radio_buttons }}</span>
                </div>

                <div>
                  {% submit_tag "Search", class:"btn btn-primary submit-button" %}
                  {% if page.calendar.allow_user_submitted? %}
                  or <a href="{{ page.calendar.new_event_url }}">Host your own</a>
                  {% endif %}
                  <div class="form-submit"></div>
                </div>

                {% if page.calendar.events_upcoming_nearby_count > 0 %}
                  {% if page.calendar.events_upcoming_nearby_count > 1 %}
                    <div class="my-2">
                      <strong>Found {{ page.calendar.events_upcoming_nearby_count }} {{ page.calendar.event_name | pluralize | downcase }}.</strong>
                    </div>
                  {% endif %}
                    <div class="my-2 map-wrap">
                      <div class="map">{{ page.calendar.events_upcoming_nearby_map }}</div>
                    </div>
                  {% else %}
                    <div class="my-2">
                      <strong>No {{ page.calendar.event_name | pluralize | downcase }} found nearby,</strong> try widening your search
                      {% if page.calendar.allow_user_submitted? %}
                        or maybe <a href="{{ page.calendar.new_event_url }}">host your own</a>?
                      {% endif %}
                    </div>
                  {% if page.calendar.events_upcoming.size > 0 %}
                    <div class="my-2 map-wrap">
                      <div class="mb-2 showing-all">Showing all {{ page.calendar.events_upcoming_count }} {{ page.calendar.event_name | pluralize | downcase }} instead.</div>
                      {{ page.calendar.events_upcoming_map }}
                    </div>
                  {% endif %}
                {% endif %}
              </div>
            </div>
          {% endform_for %}
        </div>
      </div>
    </div>

    {% if page.calendar.events_upcoming_nearby.size > 0 %}
      <ul class="list-unstyled mb-4">
        {% for event in page.calendar.events_upcoming_nearby %}
        <li class="{% unless forloop.last == true %}mb-4 pb-4 border-bottom{% endunless %}">
          {% include "event" %}
        </li>
        {% endfor %}
      </ul>

      {{ page.calendar.events_upcoming_nearby | paginate prev_label: "Previous" next_label: "Next" }}

    {% else %}

      <ul class="list-unstyled mb-4">
        {% for event in page.calendar.events_upcoming %}
        <li class="{% unless forloop.last == true %}mb-4 pb-4 border-bottom{% endunless %}">
          {% include "event" %}
        </li>
        {% endfor %}
      </ul>

      {{ page.calendar.events_upcoming | paginate prev_label: "Previous" next_label: "Next" }}

    {% endif %}

  {% else %}

    {% if page.calendar.show_map? %}

      {% if page.calendar.events_upcoming_count > 0 %}

        <div class="mb-4">
          <div class="form-wrap">
            <div class="form">
              <div class="map-wrap">
                {{ page.calendar.events_upcoming_map }}
              </div>
            </div>
          </div>
        </div>

      {% endif %}

    {% endif %}

    {% if page.calendar.events_upcoming_count == 0 %}
      No {{ page.calendar.event_name | pluralize | downcase }} yet.
      {% if page.calendar.allow_user_submitted? %}
        You should <a href="{{ page.calendar.new_event_url }}">host your own</a>!
      {% endif %}

    {% else %}

      <ul class="list-unstyled mb-4">
        {% for event in page.calendar.events_upcoming %}
        <li class="{% unless forloop.last == true %}mb-4 pb-4 border-bottom{% endunless %}">
          {% include "event" %}
        </li>
        {% endfor %}
      </ul>

      {% if page.calendar.allow_user_submitted? %}
        <div class="mt-4 pt-4 border-top">
          <a class="btn btn-secondary" href="{{ page.calendar.new_event_url }}">Host your own {{ page.calendar.event_name | downcase }}</a>
        </div>
      {% endif %}

      {{ page.calendar.events_upcoming | paginate prev_label: "&laquo;" next_label: "&raquo;" }}

    {% endif %}

  {% endif %}
</div> -->