Update division story container to match block YAMLs

torchbox · Jan 15, 2025 · 7a025d1 · 7a025d1
1 parent 6ce7997
commit 7a025d1
Showing 1 changed file with 6 additions and 3 deletions.
diff --git a/...eguide/templates/patterns/_pattern_library_only/streamfield/division_story_container.yaml b/...eguide/templates/patterns/_pattern_library_only/streamfield/division_story_container.yaml
@@ -1,9 +1,12 @@
 tags:
-  # Introduction with images block & Four photo collage block
   srcset_image:
-    item.image format-webp loading="lazy" fill-{100x100} alt=item.image.alt_text:
+    # Four photo collage block
+    'item.image format-webp loading="lazy" fill-{500x500,600x600} sizes="(max-width: 1022px) 600px, 500px" class="four-photo-collage__image" alt=item.alt_text':
       raw: |
-        <img alt="" width="100" height="100" loading="lazy" sizes="100px" src="https://picsum.photos/100/100.webp" srcset="https://picsum.photos/100/100.webp 100w">
+        <img alt="" width="500" height="500" loading="lazy" class="four-photo-collage__image" sizes="(max-width: 1022px) 600px, 500px" src="https://picsum.photos/500/500.webp" srcset="https://picsum.photos/500/500.webp 500w, https://picsum.photos/600/600.webp 600w">
+    # Introduction with images block
+    'item.image format-webp loading="lazy" fill-{200x300,400x600,600x900} sizes="(max-width: 598px) 150px, (max-width: 799px) 300px, 700px" class="intro-with-images__image" alt=item.image_alt_text':
+      raw: '<img alt="alt" class="intro-with-images__image" height="225" sizes="(max-width: 598px) 150px, (max-width: 799px) 300px, 700px" src="https://picsum.photos/200/300.webp" srcset="https://picsum.photos/200/300.webp 200w, https://picsum.photos/400/600.webp 400w, https://picsum.photos/600/900.webp 600w" width="200">'
   # Partners block
   image:
     partner_logo max-107x107 format-webp as partner_logo_image: