Refresh: Final images for donate and impact (mozilla#15638)

bedrock/mozorg/templates/mozorg/about/includes/m24/impact.html

@@ -12,15 +12,24 @@ <h2 class="m24-c-showcase-title">Let’s build a fairer future</h2>
     </header>
 
     <div class="m24-c-showcase-media">
-      {{ resp_img('img/mozorg/about/m24/impact.png',
-        srcset={'img/mozorg/about/m24/impact-high-res.png': '2x'},
+
+      {{ resp_img(
+        url='img/mozorg/about/m24/impact-800.png',
+        srcset={
+          "img/mozorg/about/m24/impact-200.png": "200w",
+          "img/mozorg/about/m24/impact-400.png": "400w",
+          "img/mozorg/about/m24/impact-800.png": "800w",
+        },
+        sizes={
+          "default": "100vw",
+        },
         optional_attributes={
           'loading': 'lazy',
-          'width': '496',
-          'height': '467',
+          'width': '400',
+          'height': '356',
           'alt': ''
         }
-        ) }}
+      ) }}
     </div>
 
     <p class="m24-c-section-cta"><a href="{{ url('mozorg.impact-report.index') }}" class="m24-c-cta" data-cta-text="Read about our commitment">Read about our commitment</a></p>

bedrock/mozorg/templates/mozorg/home/includes/m24/donate.html

@@ -11,7 +11,31 @@ <h2 class="m24-c-donate-title">{{ ftl('m24-home-donate-to-the') }}</h2>
       <p>{{ ftl('m24-home-mozilla-is-building') }}</p>
       <p>{{ ftl('m24-home-were-proudly-nonprofit') }}</p>
     </div>
-    <div class="m24-c-donate-media"><img src="{{ static('img/m24/todo-21-9.svg') }}" alt="" height="564" width="1128"></div>
+    <div class="m24-c-donate-media">
+      {{ resp_img(
+        url='img/home/2024/donate-1450.jpg',
+        srcset={
+          "img/home/2024/donate-375.jpg": "375w",
+          "img/home/2024/donate-573.jpg": "573w",
+          "img/home/2024/donate-720.jpg": "720w",
+          "img/home/2024/donate-976.jpg": "976w",
+          "img/home/2024/donate-1128.jpg": "1128w",
+          "img/home/2024/donate-1232.jpg": "1232w",
+          "img/home/2024/donate-1450.jpg": "1450w",
+        },
+        sizes={
+          "(min-width: 768px)": "calc((100vw - 32px) / 2)",
+          "(min-width: 1311px)": "calc((100vw - 64px) / 2)",
+          "(min-width: 1440px)": "680px",
+          "default": "calc(100vw - 32px)",
+        },
+        optional_attributes={
+          'width': '1450',
+          'height': '725',
+          'alt': ''
+        }
+      ) }}
+      </div>
     <p class="m24-c-donate-cta"><a href="https://foundation.mozilla.org/?form=Mozilla-Website-Homepage" class="m24-c-cta" data-cta-text="Donate">{{ ftl('m24-home-donate') }}</a></p>
   </div>
 </div>