Version 5.0.0 beta 9

applications/downloads/data/theme.xml

@@ -2213,12 +2213,13 @@
 				<section class='i-basis_100p'>
 					<h2 class='ipsBox__header ipsHide'>{lang="screenshots_ct" pluralize="$file->screenshots()->getInnerIterator()->count()"}</h2>
 					<div class=''>
-						<ul class='ipsCarousel ipsCarousel--images ipsCarousel--downloads-file-screenshots i-gap_2 i-padding_2' id='downloads-file-screenshots' tabindex="0">
+						<ul class='ipsCarousel ipsCarousel--images ipsCarousel--downloads-file-screenshots' id='downloads-file-screenshots' tabindex="0">
 							{{$fullScreenshots = iterator_to_array( $file->screenshots() );}}
 							{{foreach $file->screenshots( 1 ) as $id => $screenshot}}
 								<li>
+									{{ $dimensions = $screenshot->getImageDimensions(); }}
 									<a href="{$fullScreenshots[ $id ]->url}" class="ipsThumb" data-ipsLightbox data-ipsLightbox-group="download_{$file->id}">
-										<img src="{$screenshot->url}" alt="" loading='lazy'>
+										<img src="{$screenshot->url}" alt="" width='{expression="$dimensions[0]"}' height='{expression="$dimensions[1]"}' loading="lazy">
 									</a>
 								</li>
 							{{endforeach}}
@@ -2922,6 +2923,15 @@
 	--icon: "\f019";
 }
 
+/* Add padding to screenshot carousel */
+.ipsCarousel--downloads-file-screenshots{
+	--i-carousel--pa: 2em;
+	--i-column-gap: 1em;
+}
+.ipsCarousel--downloads-file-screenshots + .ipsCarouselNav{
+	margin-bottom: 1em;
+}
+
 .cFilePrice {
 	color: var(--i-color_secondary);
 	text-transform: uppercase;