mi/sunday
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

💄 images for comic nav

Browse Source
This commit is contained in:
mi
2025-11-13 10:38:26 +10:00
parent 2846576c2f
commit 2ac7405cf4
10 changed files with 174 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
templates/comic.html
View File

@@ -47,22 +47,60 @@
<div class="comic-navigation">
<div class="nav-buttons">
{% if comic.number > 1 %}
<a href="{{ url_for('comic', comic_id=1) }}" class="btn btn-nav">First</a>
<a href="{{ url_for('comic', comic_id=comic.number - 1) }}" class="btn btn-nav">Previous</a>
{% else %}
<span class="btn btn-nav btn-disabled">First</span>
<span class="btn btn-nav btn-disabled">Previous</span>
{% endif %}
{% if use_icon_nav %}
{# Icon-based navigation #}
{% if comic.number > 1 %}
<a href="{{ url_for('comic', comic_id=1) }}" class="btn-icon-nav" aria-label="First">
<img src="{{ url_for('static', filename='images/icons/first.png') }}" alt="First">
</a>
<a href="{{ url_for('comic', comic_id=comic.number - 1) }}" class="btn-icon-nav" aria-label="Previous">
<img src="{{ url_for('static', filename='images/icons/previous.png') }}" alt="Previous">
</a>
{% else %}
<span class="btn-icon-nav btn-icon-disabled" aria-label="First">
<img src="{{ url_for('static', filename='images/icons/first.png') }}" alt="First">
</span>
<span class="btn-icon-nav btn-icon-disabled" aria-label="Previous">
<img src="{{ url_for('static', filename='images/icons/previous.png') }}" alt="Previous">
</span>
{% endif %}
<span class="comic-date-display">{{ comic.formatted_date }}</span>
<span class="comic-date-display">{{ comic.formatted_date }}</span>
{% if comic.number < total_comics %}
<a href="{{ url_for('comic', comic_id=comic.number + 1) }}" class="btn btn-nav">Next</a>
<a href="{{ url_for('comic', comic_id=total_comics) }}" class="btn btn-nav">Latest</a>
{% if comic.number < total_comics %}
<a href="{{ url_for('comic', comic_id=comic.number + 1) }}" class="btn-icon-nav" aria-label="Next">
<img src="{{ url_for('static', filename='images/icons/next.png') }}" alt="Next">
</a>
<a href="{{ url_for('comic', comic_id=total_comics) }}" class="btn-icon-nav" aria-label="Latest">
<img src="{{ url_for('static', filename='images/icons/latest.png') }}" alt="Latest">
</a>
{% else %}
<span class="btn-icon-nav btn-icon-disabled" aria-label="Next">
<img src="{{ url_for('static', filename='images/icons/next.png') }}" alt="Next">
</span>
<span class="btn-icon-nav btn-icon-disabled" aria-label="Latest">
<img src="{{ url_for('static', filename='images/icons/latest.png') }}" alt="Latest">
</span>
{% endif %}
{% else %}
<span class="btn btn-nav btn-disabled">Next</span>
<span class="btn btn-nav btn-disabled">Latest</span>
{# Text-based navigation #}
{% if comic.number > 1 %}
<a href="{{ url_for('comic', comic_id=1) }}" class="btn btn-nav">First</a>
<a href="{{ url_for('comic', comic_id=comic.number - 1) }}" class="btn btn-nav">Previous</a>
{% else %}
<span class="btn btn-nav btn-disabled">First</span>
<span class="btn btn-nav btn-disabled">Previous</span>
{% endif %}
<span class="comic-date-display">{{ comic.formatted_date }}</span>
{% if comic.number < total_comics %}
<a href="{{ url_for('comic', comic_id=comic.number + 1) }}" class="btn btn-nav">Next</a>
<a href="{{ url_for('comic', comic_id=total_comics) }}" class="btn btn-nav">Latest</a>
{% else %}
<span class="btn btn-nav btn-disabled">Next</span>
<span class="btn btn-nav btn-disabled">Latest</span>
{% endif %}
{% endif %}
</div>
</div>

64
templates/index.html
View File

@@ -30,22 +30,60 @@
<div class="comic-navigation">
<div class="nav-buttons">
{% if comic.number > 1 %}
<a href="{{ url_for('comic', comic_id=1) }}" class="btn btn-nav">First</a>
<a href="{{ url_for('comic', comic_id=comic.number - 1) }}" class="btn btn-nav">Previous</a>
{% else %}
<span class="btn btn-nav btn-disabled">First</span>
<span class="btn btn-nav btn-disabled">Previous</span>
{% endif %}
{% if use_icon_nav %}
{# Icon-based navigation #}
{% if comic.number > 1 %}
<a href="{{ url_for('comic', comic_id=1) }}" class="btn-icon-nav" aria-label="First">
<img src="{{ url_for('static', filename='images/icons/first.png') }}" alt="First">
</a>
<a href="{{ url_for('comic', comic_id=comic.number - 1) }}" class="btn-icon-nav" aria-label="Previous">
<img src="{{ url_for('static', filename='images/icons/previous.png') }}" alt="Previous">
</a>
{% else %}
<span class="btn-icon-nav btn-icon-disabled" aria-label="First">
<img src="{{ url_for('static', filename='images/icons/first.png') }}" alt="First">
</span>
<span class="btn-icon-nav btn-icon-disabled" aria-label="Previous">
<img src="{{ url_for('static', filename='images/icons/previous.png') }}" alt="Previous">
</span>
{% endif %}
<span class="comic-date-display">{{ comic.formatted_date }}</span>
<span class="comic-date-display">{{ comic.formatted_date }}</span>
{% if comic.number < total_comics %}
<a href="{{ url_for('comic', comic_id=comic.number + 1) }}" class="btn btn-nav">Next</a>
<a href="{{ url_for('comic', comic_id=total_comics) }}" class="btn btn-nav">Latest</a>
{% if comic.number < total_comics %}
<a href="{{ url_for('comic', comic_id=comic.number + 1) }}" class="btn-icon-nav" aria-label="Next">
<img src="{{ url_for('static', filename='images/icons/next.png') }}" alt="Next">
</a>
<a href="{{ url_for('comic', comic_id=total_comics) }}" class="btn-icon-nav" aria-label="Latest">
<img src="{{ url_for('static', filename='images/icons/latest.png') }}" alt="Latest">
</a>
{% else %}
<span class="btn-icon-nav btn-icon-disabled" aria-label="Next">
<img src="{{ url_for('static', filename='images/icons/next.png') }}" alt="Next">
</span>
<span class="btn-icon-nav btn-icon-disabled" aria-label="Latest">
<img src="{{ url_for('static', filename='images/icons/latest.png') }}" alt="Latest">
</span>
{% endif %}
{% else %}
<span class="btn btn-nav btn-disabled">Next</span>
<span class="btn btn-nav btn-disabled">Latest</span>
{# Text-based navigation #}
{% if comic.number > 1 %}
<a href="{{ url_for('comic', comic_id=1) }}" class="btn btn-nav">First</a>
<a href="{{ url_for('comic', comic_id=comic.number - 1) }}" class="btn btn-nav">Previous</a>
{% else %}
<span class="btn btn-nav btn-disabled">First</span>
<span class="btn btn-nav btn-disabled">Previous</span>
{% endif %}
<span class="comic-date-display">{{ comic.formatted_date }}</span>
{% if comic.number < total_comics %}
<a href="{{ url_for('comic', comic_id=comic.number + 1) }}" class="btn btn-nav">Next</a>
<a href="{{ url_for('comic', comic_id=total_comics) }}" class="btn btn-nav">Latest</a>
{% else %}
<span class="btn btn-nav btn-disabled">Next</span>
<span class="btn btn-nav btn-disabled">Latest</span>
{% endif %}
{% endif %}
</div>
</div>