{% extends 'base.twig' %}

{% block title %}
    <title>{{ project_title }}</title>
{% endblock %}

{% block portfolio %}
    <div class="outer-container">
        <div class="container portfolio-page">
            <div class="row">
                <div class="col">
                    <ul class="breadcrumbs flex align-items-center">
                        <li><a href="#">{{ project_title }}</a></li>
                        <li>{{ albums.albumName }}</li>
                    </ul><!-- .breadcrumbs -->
                </div><!-- .col -->
            </div><!-- .row -->

            <div class="row">
                {% for albums in albums_data %}
                    <div class="col-12 col-md-6 col-lg-3">
                        <div class="portfolio-content">
                            <figure>
                                <img class="fixed-img" src="{{ immich_url }}/api/assets/{{ albums.albumThumbnailAssetId }}/thumbnail" alt="{{ albums.albumName }}">
                            </figure>

                            <div class="entry-content flex flex-column align-items-center justify-content-center">
                                <h3><a href="{{ web_url }}/album.php?id={{ albums.id }}">{{ albums.albumName }}</a></h3>

                                <ul class="flex flex-wrap justify-content-center">
                                    <li><a href="#">{{ albums.description }}</a></li>

                                </ul>
                            </div><!-- .entry-content -->
                        </div><!-- .portfolio-content -->
                    </div><!-- .col -->
                {% endfor %}
            </div>
        </div><!-- .container -->
    </div><!-- .outer-container -->
{% endblock %}