52 lines
2.0 KiB
HTML
52 lines
2.0 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block content %}
|
|
{% if archive_full_width %}
|
|
</div> {# Close container for full-width mode #}
|
|
{% endif %}
|
|
|
|
<div class="page-header{% if archive_full_width %} page-header-fullwidth{% endif %}">
|
|
<h1>Comic Archive</h1>
|
|
<p>Browse all {{ total_comics }} comics</p>
|
|
</div>
|
|
|
|
<section class="archive-content{% if archive_full_width %} archive-content-fullwidth{% endif %}"
|
|
data-total-comics="{{ total_comics }}"
|
|
data-initial-batch="{{ initial_batch }}">
|
|
{% for section_title, section_comics in sections %}
|
|
{% if section_title and sections_enabled %}
|
|
<div class="section-header">
|
|
<h2>{{ section_title }}</h2>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="archive-grid{% if archive_full_width %} archive-grid-fullwidth{% endif %}">
|
|
{% for comic in section_comics %}
|
|
<div class="archive-item{% if archive_full_width %} archive-item-fullwidth{% endif %}">
|
|
<a href="{{ url_for('comic', comic_id=comic.number) }}">
|
|
<img src="{{ url_for('static', filename='images/thumbs/' + comic.filename) }}"
|
|
onerror="this.onerror=null; this.src='{{ url_for('static', filename='images/thumbs/default.jpg') }}';"
|
|
alt="{{ comic.title if comic.title else '#' ~ comic.number }}"
|
|
loading="lazy">
|
|
<div class="archive-info">
|
|
{% if not archive_full_width %}
|
|
<h3>#{{ comic.number }}{% if comic.title %}: {{ comic.title }}{% endif %}</h3>
|
|
{% endif %}
|
|
<p class="archive-date">{{ comic.date }}</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endfor %}
|
|
</section>
|
|
|
|
{% if archive_full_width %}
|
|
<div class="container"> {# Reopen container for footer #}
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
<script src="{{ url_for('static', filename='js/archive-lazy-load.js') }}"></script>
|
|
{% endblock %}
|