Merged in feature/SW-3365-blurry-images (pull request #2746)

Feature/SW-3365 reduce upscaling of images (fix blurry images)

* fix: handle when images are wider than 3:2 but rendered in a 3:2 container

* use dimensions everywhere applicable

* fall back to using <img sizes='auto' /> if possible

* imageLoader: never nest

* remove empty test file


Approved-by: Anton Gunnarsson
Approved-by: Matilda Landström

apps/scandic-web/components/TempDesignSystem/Card/index.tsx

@@ -60,6 +60,7 @@ export default function Card({
             fill
             sizes="(min-width: 1367px) 700px, 900px"
             focalPoint={backgroundImage.focalPoint}
+            dimensions={backgroundImage.dimensions}
           />
         </div>
       )}

apps/scandic-web/components/TempDesignSystem/LoyaltyCard/index.tsx

@@ -33,6 +33,7 @@ export default function LoyaltyCard({
           className={styles.image}
           alt={image.meta.alt || image.title}
           focalPoint={image.focalPoint}
+          dimensions={image.dimensions}
         />
       ) : null}
       <Title as="h4" level="h3" textAlign="center">

apps/scandic-web/components/TempDesignSystem/TeaserCard/index.tsx

@@ -33,6 +33,7 @@ export default function TeaserCard({
             alt={image.meta?.alt || ""}
             className={styles.image}
             focalPoint={image.focalPoint}
+            dimensions={image.dimensions}
             fill
           />
         </div>