{% extends 'layout.html' %} {% block nav_home %}selected{% endblock %} {% block content %} <div class="banner-small"> <div class="banner-content"> <h1 class="banner-header">{{ config.WEBSITE_CONF.name }}</h1> {% if total_images == 0 %} <p class="banner-info">0 images D:</p> {% elif total_images == 69 %} <p class="banner-info">{{ total_images }} images, nice</p> {% else %} <p class="banner-info">{{ total_images }} images</p> {% endif %} {% if pages > 1 %} <div class="pill-row"> <div> {% if pages > 4 %} <a class="pill-item" href="{{ url_for('gallery.index') }}"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M232,128a8,8,0,0,1-8,8H91.31l58.35,58.34a8,8,0,0,1-11.32,11.32l-72-72a8,8,0,0,1,0-11.32l72-72a8,8,0,0,1,11.32,11.32L91.31,120H224A8,8,0,0,1,232,128ZM40,32a8,8,0,0,0-8,8V216a8,8,0,0,0,16,0V40A8,8,0,0,0,40,32Z"></path></svg> </a> {% endif %} <a class="pill-item" href="{% if (page - 1) > 1 %} {{ url_for('gallery.index', page=page-1) }} {% else %} {{ url_for('gallery.index') }} {% endif %}"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M224,128a8,8,0,0,1-8,8H59.31l58.35,58.34a8,8,0,0,1-11.32,11.32l-72-72a8,8,0,0,1,0-11.32l72-72a8,8,0,0,1,11.32,11.32L59.31,120H216A8,8,0,0,1,224,128Z"></path></svg> </a> </div> <span class="pill-text"> {{ page }} / {{ pages }} </span> <div> <a class="pill-item" href="{% if (page + 1) < pages %} {{ url_for('gallery.index', page=page+1) }} {% else %} {{ url_for('gallery.index', page=pages) }} {% endif %}"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M221.66,133.66l-72,72a8,8,0,0,1-11.32-11.32L196.69,136H40a8,8,0,0,1,0-16H196.69L138.34,61.66a8,8,0,0,1,11.32-11.32l72,72A8,8,0,0,1,221.66,133.66Z"></path></svg> </a> {% if pages > 4 %} <a class="pill-item" href="{{ url_for('gallery.index', page=pages) }}"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 256 256"><path d="M189.66,122.34a8,8,0,0,1,0,11.32l-72,72a8,8,0,0,1-11.32-11.32L164.69,136H32a8,8,0,0,1,0-16H164.69L106.34,61.66a8,8,0,0,1,11.32-11.32ZM216,32a8,8,0,0,0-8,8V216a8,8,0,0,0,16,0V40A8,8,0,0,0,216,32Z"></path></svg> </a> {% endif %} </div> </div> {% endif %} </div> </div> {% if images %} <div class="gallery-grid"> {% for image in images %} <a id="image-{{ image.id }}" class="gallery-item" href="{{ url_for('image.image', image_id=image.id) }}" style="background-color: rgb({{ image.colours.0.0 }}, {{ image.colours.0.1 }}, {{ image.colours.0.2 }})"> <div class="image-filter"> <p class="image-subtitle"></p> <p class="image-title"><span class="time">{{ image.created_at }}</span></p> </div> <img fetchpriority="low" alt="{% if image.alt %}{{ image.alt }}{% else %}Image Thumbnail{% endif %}" data-src="{{ url_for('api.file', file_name=image.filename) }}?r=thumb" onload="this.classList.add('loaded');" id="lazy-load"/> </a> {% endfor %} </div> {% else %} <div class="big-text"> <h1>*crickets chirping*</h1> <p>There are no images here yet, upload some!</p> </div> {% endif %} {% endblock %}