{% extends 'layout.html' %}
{% block content %}
<div class="row">
  <div class="col">
    <div class="row">
      {% if entity.image_id %}
        <div class="col-lg-1">
          {{ entity|profile_image(False, max_width_100=True)|safe }}
        </div>
      {% endif %}
      <div class="col">
        <div class="row g-1">
          {{ form|display_form(manual_page='entity/' + entity.class_.group['name'])|safe }}
          {{ entity.class_.group['name']|citation_example|safe }}
        </div>
      </div>
      {% if entity.class_.attributes.get('location') %}
        <div class="col-lg-6 d-flex align-items-stretch">
          <div onclick="toggleMapWidth(this)" class="d-none btn btn-light d-lg-flex align-items-center"><i
              class="fas fa-chevron-right"></i></div>
          <div id="map" class="map"></div>
        </div>
      <link rel="stylesheet" href="{{ url_for('static', filename='node_modules/leaflet-draw/dist/leaflet.draw.css', v=config.VERSION) }}">
      <script src="{{ url_for('static', filename='node_modules/leaflet-draw/dist/leaflet.draw.js', v=config.VERSION) }}"></script>
      <script src="{{ url_for('static', filename='js/map/map.js', v=config.VERSION) }}"></script>
      <script src="{{ url_for('static', filename='js/map/draw.js', v=config.VERSION) }}"></script>
      {% endif %}
    </div>
  </div>
</div>
{% endblock %}