update markup for media group component to accommodate different imag…

…e sizes
middlebury · Nov 15, 2024 · 6fac1f1 · 6fac1f1
1 parent 04af85a
commit 6fac1f1
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/src/data/image_styles.yml b/src/data/image_styles.yml
@@ -124,6 +124,12 @@ image_styles:
       - 400x225
       - 640x360
 
+  media_group:
+    title: Media Group component
+    ratio: 'any'
+    srcset:
+      - 400x225
+
   event_teaser:
     title: Event teaser
     ratio: 'any'

diff --git a/src/templates/paragraphs/media-group.twig b/src/templates/paragraphs/media-group.twig
@@ -12,14 +12,14 @@
 
   <div class="row">
     {% for item in media_content_items %}
-      <div class="col-md-6 mb-7">
+      <div class="col-md-6 mb-7 d-flex{{loop.index % 2 == 0 ? '' : ' justify-content-md-end'}} align-items-start">
         {% if item == 'video' %}
           {% include 'partials/video.twig' %}
         {% elseif item == 'audio' %}
           {% include 'paragraphs/audio.twig' %}
         {% elseif item == 'image' %}
           {% include 'partials/image-with-caption.twig' with {
-            name: 'schedule'
+            name: 'media_group'
           } %}
         {% endif %}
       </div>