From dfd4f8a4e0ba54d333e37de1a0767644d7e04730 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9DNyymix=E2=80=9D?= <nyymix@gmail.com>
Date: Wed, 19 Mar 2025 17:00:12 +0200
Subject: [PATCH] Fix parallax

---
 .../templates/gallery/partials/parallax.html  | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/gallery/templates/gallery/partials/parallax.html b/gallery/templates/gallery/partials/parallax.html
index efeb491..ddec3ac 100644
--- a/gallery/templates/gallery/partials/parallax.html
+++ b/gallery/templates/gallery/partials/parallax.html
@@ -7,12 +7,27 @@
         {% if top_photos %}
         {% for photo in top_photos %}
         <li>
-            <img src="{{ photo.photo_bg.url }}" alt="{{ photo.album.name }} - {{ photo.slug }}" loading="lazy" uk-cover />
+            <img src="{{ photo.photo_md.url }}" 
+                srcset="
+                    {{ photo.photo_sm.url }} 480w,
+                    {{ photo.photo_md.url }} 1024w,
+                    {{ photo.photo_bg.url }} 1920w
+                " 
+                sizes="100vw"
+                width="{{ photo.width }}" 
+                height="{{ photo.height }}" 
+                style="aspect-ratio: 7 / 3;"
+                alt="{{ photo.album.name }} - {{ photo.slug }}" 
+                {% if forloop.first %} loading="eager" {% else %} loading="lazy" {% endif %}
+                uk-cover />
         </li>
         {% endfor %}
         {% else %}
         <li>
-            <img src="{% static 'img/placeholder.png' %}" alt="" uk-cover />
+            <img src="{% static 'img/placeholder.png' %}" 
+                    width="1920" height="823"
+                    style="aspect-ratio: 7 / 3;"
+                    alt="Placeholder" uk-cover />
         </li>
         {% endif %}
     </ul>