{% extends 'layout.html' %}

{% block content %}

  {{ content }}

  <section class='applet_container autosize'><div class='applet' data-payload='{"command":"dataset_list"}'></div></section>

  <section class='wide dataset-intro'>

    <div class="dataset-list">
    {% for dataset in datasets %}
      <a href="{{ dataset.url }}" style="background-image: url(https://nyc3.digitaloceanspaces.com/megapixels/v1{{ dataset.url }}assets/index.jpg)">
        <div class="dataset">
          <span class='title'>{{ dataset.title }}</span>
          <div class='fields'>
            <div class='year visible'><span>{{ dataset.meta.dataset.year_published }}</span></div>
            <div class='purpose'><span>{{ dataset.meta.dataset.purpose }}</span></div>
            <div class='images'><span>{{ dataset.meta.dataset.images }} images</span></div>
            <div class='identities'><span>{{ dataset.meta.dataset.identities }}</span></div>
          </div>
        </div>
      </a>
    {% endfor %}
    </div>
  </section>

{% endblock %}