use header image as thumbnail

gip-inclusion · Sep 18, 2024 · de6f34b · de6f34b
1 parent 6a6d580
commit de6f34b
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 14 deletions.
diff --git a/lemarche/templates/cms/article_item.html b/lemarche/templates/cms/article_item.html
@@ -1,21 +1,16 @@
 {% load wagtailimages_tags %}
 {% load inclusion_cms %}
-
 <div class="fr-card fr-card--shadow fr-enlarge-link">
     <div class="fr-card__body">
         <div class="fr-card__content">
             <h3 class="fr-card__title">
                 <a href="{{ article.url }}">{{ article.title }}</a>
             </h3>
             <p class="fr-card__desc">{{ article.specific.intro | truncatechars:200 }}</p>
-            <div class="fr-card__start">
-                {% show_article_categories_badges article %}
-            </div>
+            <div class="fr-card__start">{% show_article_categories_badges article %}</div>
         </div>
     </div>
     <div class="fr-card__header">
-        <div class="fr-card__img">
-            {% image article.specific.image fill-655x388 class="fr-responsive-img" loading="lazy" %}            
-        </div>
+        <div class="fr-card__img">{% image article.header_image fill-655x388 class="fr-responsive-img" loading="lazy" %}</div>
     </div>
 </div>
diff --git a/lemarche/templates/dashboard/_ressource_card.html b/lemarche/templates/dashboard/_ressource_card.html
@@ -1,9 +1,7 @@
 {% load static wagtailcore_tags wagtailimages_tags advert_cms %}
-
 {% if user_kind == "BUYER" %}
     {% cms_advert layout="fr-card" %}
 {% endif %}
-
 <div class="fr-card">
     <div class="fr-card__body">
         <div class="fr-card__content">
@@ -18,15 +16,21 @@ <h3 class="fr-card__title">
                 {% for ressource in ressources %}
                     <div class="fr-grid-row fr-grid-row--gutters{% if not forloop.last %} fr-mb-4v{% endif %}">
                         <div class="fr-col-3 fr-hidden fr-unhidden-lg">
-                            {% if ressource.image %}
-                                {% image ressource.image fill-100x60 as tmp_img %}
-                                <img src="{{ tmp_img.url }}" width="100" height="60" alt="{{ tmp_img.alt }}" class="rounded" loading="lazy" />
+                            {% if ressource.header_image %}
+                                {% image ressource.header_image fill-100x60 as tmp_img %}
+                                <img src="{{ tmp_img.url }}"
+                                     width="100"
+                                     height="60"
+                                     alt="{{ tmp_img.alt }}"
+                                     class="rounded"
+                                     loading="lazy" />
                             {% else %}
                                 <img src="{% static "images/default-100x60.png" %}" alt="" width="100" height="60" class="rounded">
                             {% endif %}
                         </div>
                         <div class="fr-col-12 fr-col-lg-9">
-                            <time aria-label="Date de publication">{{ ressource.last_published_at }}</time><br />
+                            <time aria-label="Date de publication">{{ ressource.last_published_at }}</time>
+                            <br />
                             <a href="{% pageurl ressource %}"><strong>{{ ressource.title }}</strong></a>
                         </div>
                     </div>
@@ -36,7 +40,8 @@ <h3 class="fr-card__title">
         <div class="fr-card__footer">
             <ul class="fr-btns-group--right fr-btns-group fr-btns-group--inline fr-btns-group--icon-right">
                 <li>
-                    <a class="fr-btn fr-icon-arrow-right-s-line fr-btn--tertiary-no-outline" href="/ressources/{% if category_slug %}categories/{{ category_slug }}/{% endif %}">
+                    <a class="fr-btn fr-icon-arrow-right-s-line fr-btn--tertiary-no-outline"
+                       href="/ressources/{% if category_slug %}categories/{{ category_slug }}/{% endif %}">
                         Voir toutes les ressources
                     </a>
                 </li>