kennethreitz.org/tuftecms/templates/photo.html

{% extends "base.html" %}

{% block content %}
<div style="text-align: center; margin-bottom: 3rem;">
    <h1 style="margin-bottom: 0.5rem;">{{ title }}</h1>
    <p class="subtitle">Photo</p>
</div>

<figure class="fullwidth">
    <img src="{{ image_path }}" alt="{{ title }}" />
</figure>

<section>
    <p><a href="{{ image_path }}" target="_blank">View Full Size</a> | 
       <a href="{{ image_path }}" download>Download</a></p>
</section>

{% if gallery_images and gallery_images | length > 1 %}
<section>
    <h2>Gallery</h2>
    
    {% set current_index = namespace(value=-1) %}
    {% for img in gallery_images %}
        {% if img.is_current %}
            {% set current_index.value = loop.index0 %}
        {% endif %}
    {% endfor %}
    
    <p>
        {% if current_index.value > 0 %}
            <a href="{{ gallery_images[current_index.value - 1].url }}">← Previous</a>
        {% endif %}
        
        {{ current_index.value + 1 }} of {{ gallery_images | length }}
        
        {% if current_index.value < (gallery_images | length - 1) %}
            <a href="{{ gallery_images[current_index.value + 1].url }}">Next →</a>
        {% endif %}
    </p>
    
    <ul>
        {% for img in gallery_images %}
        <li>
            {% if not img.is_current %}
                <a href="{{ img.url }}">{{ img.name }}</a>
            {% else %}
                <strong>{{ img.name }}</strong> (current)
            {% endif %}
        </li>
        {% endfor %}
    </ul>
</section>
{% endif %}

<nav>
    {% if breadcrumbs %}
        {% set parent_path = breadcrumbs[-1].url if breadcrumbs else '/directory' %}
    {% else %}
        {% set parent_path = '/directory' %}
    {% endif %}
    
    <p><a href="{{ parent_path }}">← Back to Directory</a></p>
</nav>
{% endblock %}