photos.html

<!-- templates/photos.html -->
{% extends "base.html" %}
{% block title %}Photos · Kishaloy Roy{% endblock %}

{% block head %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/photos_page.css') }}">
{% endblock %}

{% block content %}
  <h1 class="page-title">My Photo Gallery</h1>
  <p class="page-desc">Some Photos I Clicked.</p>

  {% if photos|length == 0 %}
    <p class="empty">No photos yet. Put images into <span class="mono">static/images/photos/</span>.</p>
  {% else %}
    <section class="gallery" aria-label="Photo gallery">
      {% for p in photos %}
        <a class="tile" href="{{ url_for('static', filename=p) }}" target="_blank" rel="noreferrer">
          <img src="{{ url_for('static', filename=p) }}" alt="Photo {{ loop.index }}">
        </a>
      {% endfor %}
    </section>
  {% endif %}
{% endblock %}