From 897fa9d2312c413ffa1eb5fe66730926a0547cc8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9DNyymix=E2=80=9D?= <nyymix@gmail.com>
Date: Sat, 5 Apr 2025 22:17:42 +0300
Subject: [PATCH] Update templates

---
 gallery/templates/gallery/about.html          |  5 ++++
 gallery/templates/gallery/album_list.html     | 25 +++++++++++++++----
 .../templates/gallery/partials/parallax.html  |  8 ++++++
 gallery/templates/gallery/search.html         | 23 +++++++++++++----
 4 files changed, 51 insertions(+), 10 deletions(-)

diff --git a/gallery/templates/gallery/about.html b/gallery/templates/gallery/about.html
index 54c233a..c882b59 100644
--- a/gallery/templates/gallery/about.html
+++ b/gallery/templates/gallery/about.html
@@ -5,6 +5,11 @@
  <!-- Title -->
 {% block title %} Gallery : About{% endblock %}
 
+<!-- Parallax -->
+{% block parallax %}
+    {% include "./partials/parallax.html" %}
+{% endblock %}
+
  <!-- Content -->
 {% block content %}
 
diff --git a/gallery/templates/gallery/album_list.html b/gallery/templates/gallery/album_list.html
index f1a2841..63b8d1b 100644
--- a/gallery/templates/gallery/album_list.html
+++ b/gallery/templates/gallery/album_list.html
@@ -13,21 +13,36 @@
 {% block content %}
 
 <div class="uk-grid-small uk-child-width-1-2@s uk-child-width-1-3@m" uk-grid="masonry: true">
+
     {% for album in album_list %}
     <div>
-        <div class="uk-card uk-card-default">
+        <div class="uk-card uk-card-default uk-height-1-1">
+
+            <!-- Album cover image -->
             <div class="uk-card-media-top">
                 <a href="{{ album.get_absolute_url }}">
-                <img src="{{ album.cover_url }}" alt="{{ album.name }}">
+                    <img src="{{ album.cover_url }}" 
+                         alt="Cover image for {{ album.name }}"
+                         title="{{ album.name }}" 
+                         loading="lazy"
+                         class="uk-border-rounded">
                 </a>
             </div>
-            <div class="uk-overlay uk-overlay-primary uk-position-bottom uk-padding-small">
-                <h3 class="uk-card-title"><a href="{{ album.get_absolute_url }}">{{ album }}</a></h3>
-                <p>{{ album.album_date|date:"d.m.Y" }} &bull; {{ album.photos_in_album }} photos</p>
+
+            <!-- Album info overlay -->
+            <div class="uk-overlay uk-overlay-primary uk-position-bottom uk-padding-small uk-border-rounded">
+                <h3 class="uk-card-title uk-margin-remove-bottom">
+                    <a href="{{ album.get_absolute_url }}">{{ album }}</a>
+                </h3>
+                <p class="uk-text-small uk-margin-remove-top">
+                    {{ album.album_date|date:"d.m.Y" }} &bull; {{ album.photos_in_album }} photos
+                </p>
             </div>
+
         </div>
     </div>
     {% endfor %}
+
 </div>
 
 {% include "./partials/pagination.html" %}
diff --git a/gallery/templates/gallery/partials/parallax.html b/gallery/templates/gallery/partials/parallax.html
index ddec3ac..d65bf83 100644
--- a/gallery/templates/gallery/partials/parallax.html
+++ b/gallery/templates/gallery/partials/parallax.html
@@ -33,4 +33,12 @@
     </ul>
     <a class="uk-position-center-left uk-position-small uk-hidden-hover" href="#" uk-slidenav-previous uk-slideshow-item="previous"></a>
     <a class="uk-position-center-right uk-position-small uk-hidden-hover" href="#" uk-slidenav-next uk-slideshow-item="next"></a>
+    <div class="uk-position-top uk-padding-small">
+        <h1>Gallery</h1>
+    </div>
+    <div class="uk-overlay uk-overlay-primary uk-position-bottom uk-padding-small">
+        <p class="uk-text-small uk-margin-remove-top">
+            Just another wannabe photographer...
+        </p>
+    </div>
 </div>
\ No newline at end of file
diff --git a/gallery/templates/gallery/search.html b/gallery/templates/gallery/search.html
index cc68d1d..0f97e69 100644
--- a/gallery/templates/gallery/search.html
+++ b/gallery/templates/gallery/search.html
@@ -16,16 +16,29 @@
     {% if results %}
         {% for album in results %}
         <div>
-            <div class="uk-card uk-card-default">
+            <div class="uk-card uk-card-default uk-height-1-1">
+    
+                <!-- Album cover image -->
                 <div class="uk-card-media-top">
                     <a href="{{ album.get_absolute_url }}">
-                    <img src="{{ album.cover_url }}" alt="{{ album.name }}">
+                        <img src="{{ album.cover_url }}" 
+                             alt="Cover image for {{ album.name }}"
+                             title="{{ album.name }}" 
+                             loading="lazy"
+                             class="uk-border-rounded">
                     </a>
                 </div>
-                <div class="uk-overlay uk-overlay-primary uk-position-bottom uk-padding-small">
-                    <h3 class="uk-card-title"><a href="{{ album.get_absolute_url }}">{{ album }}</a></h3>
-                    <p>{{ album.album_date|date:"d.m.Y" }} &bull; {{ album.photos_in_album }} photos</p>
+    
+                <!-- Album info overlay -->
+                <div class="uk-overlay uk-overlay-primary uk-position-bottom uk-padding-small uk-border-rounded">
+                    <h3 class="uk-card-title uk-margin-remove-bottom">
+                        <a href="{{ album.get_absolute_url }}">{{ album }}</a>
+                    </h3>
+                    <p class="uk-text-small uk-margin-remove-top">
+                        {{ album.album_date|date:"d.m.Y" }} &bull; {{ album.photos_in_album }} photos
+                    </p>
                 </div>
+    
             </div>
         </div>
         {% endfor %}