{% extends "base.html" %}
{% block title %}Collections — {{ site_title }}{% endblock %}
{% block content %}
<div class="page-header">
  <h1>Collections</h1>
</div>

<div class="collection-grid">
  {% for c in collections %}
  <a href="/collections/{{ c.slug }}/" class="collection-card">
    <div class="collection-card-image">
      {% if c.preview and c.preview.thumbnail_small %}
      <img src="{{ c.preview.thumbnail_small.url }}" alt="{{ c.title }}">
      {% elif c.preview and c.preview.thumbnail_medium %}
      <img src="{{ c.preview.thumbnail_medium.url }}" alt="{{ c.title }}">
      {% endif %}
      <span class="collection-card-count">{{ c.image_count }}</span>
    </div>
    <div class="collection-card-info">
      <h3>{{ c.title }}</h3>
    </div>
  </a>
  {% empty %}
  <div class="empty" style="grid-column: 1 / -1;">No collections yet.</div>
  {% endfor %}
</div>
{% endblock %}