fix sf procuct detail page main image display

This commit is contained in:
2026-08-28 19:18:43 +02:00
parent 60fa44bc32
commit f45b4916d5
2 changed files with 20 additions and 11 deletions
@@ -1051,14 +1051,21 @@ a:hover {
} }
} }
.sf-product-gallery__main { .sf-product-gallery__media {
display: block; display: block;
width: 100%; width: 100%;
aspect-ratio: 1; aspect-ratio: 1;
object-fit: cover; background: var(--sf-surface-muted);
border-radius: var(--sf-radius); border-radius: var(--sf-radius);
border: 1px solid var(--sf-border); border: 1px solid var(--sf-border);
background: var(--sf-surface-muted); overflow: hidden;
}
.sf-product-gallery__main {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
} }
.sf-product-gallery__thumbs { .sf-product-gallery__thumbs {
@@ -1,13 +1,15 @@
{{#if selectedImageUrl}} {{#if selectedImageUrl}}
<div class='sf-product-gallery'> <div class='sf-product-gallery'>
{{> storefront-image <div class='sf-product-gallery__media'>
class='sf-product-gallery__main' {{> storefront-image
src=selectedImageUrl class='sf-product-gallery__main'
alt=productTitle src=selectedImageUrl
width='1' alt=productTitle
height='1' width='1'
fetchPriority='high' height='1'
}} fetchPriority='high'
}}
</div>
{{#if galleryImages}} {{#if galleryImages}}
{{#if (gt galleryImages.length 1)}} {{#if (gt galleryImages.length 1)}}