Fix Edge problem

gallery/templates/gallery/partials/parallax.html

@@ -2,30 +2,26 @@
 {% load static %}
 
 <div class="uk-position-relative uk-visible-toggle uk-light" tabindex="-1" uk-slideshow="ratio: 7:3; autoplay: true; animation: fade; min-height: 300;">
+
     <ul class="uk-slideshow-items">
         {% random_photos_landscape as top_photos %}
         {% if top_photos %}
         {% for photo in top_photos %}
         <li>
-            {% with photo.aspect_ratio|default:2.33 as ratio %}
-            <img 
-                src="{{ photo.photo_sm.url }}" 
+            <img src="{{ photo.photo_md.url }}" 
                 srcset="
                     {{ photo.photo_sm.url }} 480w,
                     {{ photo.photo_md.url }} 1024w,
                     {{ photo.photo_bg.url }} 1920w
                 " 
-                sizes="(max-width: 640px) 480px, (max-width: 1200px) 1024px, 1920px"
-                width="1920" 
-                height="823"
-                style="aspect-ratio: {{ ratio }};"
-                alt="Photo from {{ photo.album.name }} album"
+                sizes="100vw"
+                width="{{ photo.width }}" 
+                height="{{ photo.height }}" 
+                style="aspect-ratio: 7 / 3;"
+                alt="Foto from {{ photo.album.name }} album"
                 title="{{ photo.album.name }}" 
                 {% if forloop.first %} loading="eager" decoding="async" {% else %} loading="lazy" decoding="async" {% endif %}
-                uk-cover
-                class="lazyfade"
-            />
-            {% endwith %}
+                uk-cover />
         </li>
         {% endfor %}
         {% else %}
@@ -33,7 +29,7 @@
             <img src="{% static 'img/placeholder.png' %}" 
                     width="1920" height="823"
                     style="aspect-ratio: 7 / 3;"
-                    alt="Placeholder" uk-cover class="lazyfade" />
+                    alt="Placeholder" uk-cover />
         </li>
         {% endif %}
     </ul>

static/css/muistox.css

@@ -38,13 +38,3 @@ body {
 		transform: scale(1);
 	}
 }
-
-.lazyfade {
-	opacity: 0;
-	transition: opacity 1s ease;
-}
-
-.lazyfade[loading="eager"],
-.lazyfade[loading="lazy"]:not([src=""]) {
-	opacity: 1;
-}