86 lines
No EOL
3.2 KiB
HTML
86 lines
No EOL
3.2 KiB
HTML
{% extends "base_dark.html" %}
|
|
|
|
<!-- Title -->
|
|
{% block title %} Gallery : Photo : {{ photo.slug }} {% endblock %}
|
|
|
|
|
|
<!-- Content -->
|
|
{% block content %}
|
|
|
|
<div uk-grid>
|
|
|
|
<div class="uk-width-1-1 uk-width-3-4@m">
|
|
<div uk-lightbox>
|
|
<a href="{{ photo.photo_bg.url }}" data-alt="{{ photo.slug }}">
|
|
<img
|
|
src="{{ photo.photo_md.url }}"
|
|
srcset="
|
|
{{ photo.photo_sm.url }} 320w,
|
|
{{ photo.photo_md.url }} 720w,
|
|
{{ photo.photo_bg.url }} 1920w
|
|
"
|
|
sizes="(max-width: 640px) 320px,
|
|
(max-width: 960px) 720px,
|
|
1920px"
|
|
alt="{{ photo.slug }}"
|
|
style="max-width: 100%; max-height: 90vh; object-fit: contain;" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="uk-margin-top uk-width-1-4@m uk-visible@m">
|
|
|
|
<div class="uk-grid-small" uk-grid>
|
|
<div class="uk-width-expand" uk-leader>Album name</div>
|
|
<div><a href="{{ photo.album.get_absolute_url }}">{{ photo.album.name }}</a></div>
|
|
</div>
|
|
<div class="uk-grid-small" uk-grid>
|
|
<div class="uk-width-expand" uk-leader>Photo id</div>
|
|
<div uk-lightbox>
|
|
<a href="{{ photo.photo_bg.url }}">{{ photo.slug }}</a>
|
|
</div>
|
|
</div>
|
|
<div class="uk-grid-small" uk-grid>
|
|
<div class="uk-width-expand" uk-leader>Photo Taken</div>
|
|
<div>{{ photo.taken_at|date:"d.m.Y H:i" }}</div>
|
|
</div>
|
|
<div class="uk-grid-small" uk-grid>
|
|
<div class="uk-width-expand" uk-leader>Views</div>
|
|
<div>{{ photo.views }}</div>
|
|
</div>
|
|
<div class="uk-grid-small" uk-grid>
|
|
<div class="uk-width-expand" uk-leader>Likes</div>
|
|
<div>{{ photo.likes }}</div>
|
|
</div>
|
|
<div class="uk-grid-small" uk-grid>
|
|
<div class="uk-width-expand" uk-leader>Download</div>
|
|
<div><a href="{{ photo.photo.url }}">{{ photo.width }}x{{ photo.height }}</a></div>
|
|
</div>
|
|
|
|
<div class="uk-grid-small" uk-grid>
|
|
<div class="uk-width-expand" uk-leader>
|
|
{% if prev %}
|
|
<a href="{% url 'gallery:photo_url' photo.album.slug prev.slug %}">« Prev</a>
|
|
{% endif %}
|
|
</div>
|
|
<div>
|
|
{% if next %}
|
|
<a href="{% url 'gallery:photo_url' photo.album.slug next.slug %}">Next »</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<form action="{% url 'gallery:photo_url' photo.album.slug photo.slug %}" method="POST" class="uk-form">
|
|
{% csrf_token %}
|
|
<button type="submit" name="like" value="true" class="uk-button uk-button-primary">
|
|
<span uk-icon="icon: heart"></span> Like
|
|
</button>
|
|
</form>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
{% endblock %} |