fix svg load (#2969)

Author: JacobCoffee

apps/sponsors/admin.py

@@ -736,24 +736,35 @@ def get_sponsor_landing_page_url(self, obj):
     @admin.display(description="Web Logo")
     def get_sponsor_web_logo(self, obj):
         """Render and return the sponsor's web logo as a thumbnail image."""
-        html = "{% load thumbnail %}{% thumbnail sponsor.web_logo '150x150' format='PNG' quality=100 as im %}<img src='{{ im.url}}'/>{% endthumbnail %}"
+        img = obj.sponsor.web_logo
+        if not img:
+            return "---"
+        if img.name and img.name.lower().endswith(".svg"):
+            return format_html(
+                '<img src="{}" style="max-width:150px;max-height:150px"/>',
+                img.url,
+            )
+        html = "{% load thumbnail %}{% thumbnail img '150x150' format='PNG' quality=100 as im %}<img src='{{ im.url}}'/>{% endthumbnail %}"
         template = Template(html)
-        context = Context({"sponsor": obj.sponsor})
-        html = template.render(context)
-        return mark_safe(html)  # noqa: S308
+        context = Context({"img": img})
+        return mark_safe(template.render(context))  # noqa: S308
 
     @admin.display(description="Print Logo")
     def get_sponsor_print_logo(self, obj):
         """Render and return the sponsor's print logo as a thumbnail image."""
         img = obj.sponsor.print_logo
-        html = "---"
-        if img:
-            template = Template(
-                "{% load thumbnail %}{% thumbnail img '150x150' format='PNG' quality=100 as im %}<img src='{{ im.url}}'/>{% endthumbnail %}"
+        if not img:
+            return "---"
+        if img.name and img.name.lower().endswith(".svg"):
+            return format_html(
+                '<img src="{}" style="max-width:150px;max-height:150px"/>',
+                img.url,
             )
-            context = Context({"img": img})
-            html = mark_safe(template.render(context))  # noqa: S308
-        return html
+        template = Template(
+            "{% load thumbnail %}{% thumbnail img '150x150' format='PNG' quality=100 as im %}<img src='{{ im.url}}'/>{% endthumbnail %}"
+        )
+        context = Context({"img": img})
+        return mark_safe(template.render(context))  # noqa: S308
 
     @admin.display(description="Primary Phone")
     def get_sponsor_primary_phone(self, obj):

apps/sponsors/templates/sponsors/partials/sponsors-list.html

@@ -10,14 +10,18 @@ <h2 class="widget-title" style="text-align: center;">Sponsors</h2>
   <p style="text-align: center;">Visionary sponsors help to host Python downloads.</p>
   <div style="display: grid; grid-gap: 2em; grid-template-columns: repeat(auto-fit, minmax(150px, 0fr)); align-items: center; justify-content: center; margin-top: 1.5em;">
   {% for sponsorship in sponsorships %}
-  {% thumbnail sponsorship.sponsor.web_logo "x150" format="PNG" quality=100 as im %}
     <div style="text-align: center;">
       <a href="{{ sponsorship.sponsor.landing_page_url }}" rel="sponsored noopener" target="_blank" style="border-bottom: 0;">
+        {% if sponsorship.sponsor.web_logo.name|lower|slice:"-4:" == ".svg" %}
+        <img src="{{ sponsorship.sponsor.web_logo.url }}" alt="{{ sponsorship.sponsor.name }} logo" style="max-height:150px;max-width:150px;height:auto;width:auto;">
+        {% else %}
+        {% thumbnail sponsorship.sponsor.web_logo "x150" format="PNG" quality=100 as im %}
         <img src="{{ im.url }}" alt="{{ sponsorship.sponsor.name }} logo" style="max-height:150px;max-width:150px;height:auto;width:auto;">
+        {% endthumbnail %}
+        {% endif %}
       </a>
       <p style="margin-top: 0.5em; margin-bottom: 0; font-size: 0.875em; color: #4d4d4d;">{{ sponsorship.sponsor.name }}</p>
     </div>
-  {% endthumbnail %}
   {% endfor %}
   </div>
 {% endcache CACHED_DOWNLOAD_SPONSORS_LIST %}
@@ -28,11 +32,15 @@ <h2 class="widget-title" style="text-align: center;">Sponsors</h2>
   <h3 class="widget-title">Job Board Sponsors</h3>
   <div style="display: grid; grid-gap: 1em; grid-template-columns: repeat(auto-fit, minmax(100px, 0fr)); grid-template-rows: repeat(1, minmax(50px, 0fr)); align-items: center; justify-content: center; margin-top: 1em;">
   {% for sponsorship in sponsorships %}
-  {% thumbnail sponsorship.sponsor.web_logo "x100" format="PNG" quality=100 as im %}
     <div>
+      {% if sponsorship.sponsor.web_logo.name|lower|slice:"-4:" == ".svg" %}
+      <img src="{{ sponsorship.sponsor.web_logo.url }}" alt="{{ sponsorship.sponsor.name }} logo" style="max-height:100px;max-width:100px;height:auto;width:auto;">
+      {% else %}
+      {% thumbnail sponsorship.sponsor.web_logo "x100" format="PNG" quality=100 as im %}
       <img src="{{ im.url }}" alt="{{ sponsorship.sponsor.name }} logo" style="max-height:100px;max-width:100px;height:auto;width:auto;">
+      {% endthumbnail %}
+      {% endif %}
     </div>
-  {% endthumbnail %}
   {% endfor %}
   </div>
 {% endcache CACHED_JOBS_SPONSORS_LIST %}