feat: skip ratio if 'cover' attribute is true

Author: Daniel Morse

packages/components/bolt-image/src/image.js

@@ -125,7 +125,7 @@ class BoltImage extends withLitHtml() {
     }
 
     const _isJpg = path.extname(src) === '.jpg';
-    const _canUseRatio = ratioW > 0 && ratioH > 0 && useRatio;
+    const _canUseRatio = ratioW > 0 && ratioH > 0 && useRatio && !cover;
     // Only JPGs allowed, PNGs can have transparency and may not look right layered over placeholder
     const _canUsePlaceholder = (_canUseRatio || cover) && _isJpg;
 
@@ -177,7 +177,9 @@ class BoltImage extends withLitHtml() {
         return html`
           <noscript>
             <img
-              class="${cx('c-bolt-image__image')}"
+              class="${cx('c-bolt-image__image', {
+                'c-bolt-image--cover': cover,
+              })}"
               src="${src}"
               alt="${ifDefined(alt ? alt : undefined)}"
               srcset="${ifDefined(!lazyload ? srcset || src : undefined)}"

packages/components/bolt-image/src/image.twig

@@ -27,7 +27,7 @@
 
 {% set is_jpg = src|split('.')|last == "jpg" %}
 {% set useAspectRatio = useAspectRatio ?? true %}
-{% set can_use_ratio = width > 0 and height > 0 and useAspectRatio is sameas(true) %}
+{% set can_use_ratio = width > 0 and height > 0 and useAspectRatio is sameas(true) and object is sameas(false) %}
 {# Only JPGs allowed, PNGs can have transparency and may not look right layered over placeholder #}
 {% set can_use_placeholder = can_use_ratio or cover %}