{% extends 'base.html' %}
{% block title %}Gallery | APSS Nepal{% endblock %}
{% block content %}
<section class="page-ribbon"><div class="container">⌂ <a href="{{ url_for('home') }}">HOME</a> &nbsp; &gt; &nbsp; GALLERY</div></section>
<section class="page-intro">
  <div class="container">
    <h1>Gallery</h1>
    <p>Photo archive of APSS conferences, political roundtables, youth programs, international exchanges, trainings and consultations.</p>
  </div>
</section>
<section class="section compact">
  <div class="container">
    <div class="card-grid three gallery-grid">
      {% for image in gallery %}
      <article class="gallery-card">
        <div class="gallery-image {% if image.image_path %}has-image{% endif %}" {% if image.image_path %}style="background-image:url('{{ url_for('static', filename=image.image_path) }}')"{% endif %}></div>
        <div class="card-body">
          <span class="tag">{{ image.category }}</span>
          <h2>{{ image.title }}</h2>
          <p>{{ image.caption }}</p>
        </div>
      </article>
      {% endfor %}
    </div>
  </div>
</section>
{% endblock %}