Add card columns template

froide_govplan/models.py

@@ -27,6 +27,15 @@ class PlanStatus(models.TextChoices):
     DEFERRED = ("deferred", _("deferred"))
 
 
+STATUS_CSS = {
+    PlanStatus.NOT_STARTED: "secondary",
+    PlanStatus.STARTED: "primary",
+    PlanStatus.PARTIALLY_IMPLEMENTED: "warning",
+    PlanStatus.IMPLEMENTED: "success",
+    PlanStatus.DEFERRED: "danger",
+}
+
+
 class PlanRating(models.IntegerChoices):
     TERRIBLE = 1, _("terrible")
     BAD = 2, _("bad")
@@ -168,6 +177,9 @@ class GovernmentPlan(models.Model):
         if last_status_update or last_rating_update:
             self.save()
 
+    def get_status_css(self):
+        return STATUS_CSS.get(self.status, "")
+
 
 class GovernmentPlanUpdate(models.Model):
     plan = models.ForeignKey(
@@ -230,6 +242,7 @@ if CMSPlugin:
     PLUGIN_TEMPLATES = [
         ("froide_govplan/plugins/default.html", _("Normal")),
         ("froide_govplan/plugins/progress.html", _("Progress")),
+        ("froide_govplan/plugins/card_cols.html", _("Card columns")),
     ]
 
     class GovernmentPlansCMSPlugin(CMSPlugin):

froide_govplan/templates/froide_govplan/detail.html

@@ -26,7 +26,7 @@
       <dt>Status</dt>
       <dd>{{ object.get_status_display }}</dd>
       {% if object.rating %}
-        <dt>Rating</dt>
+        <dt>Bewertung</dt>
         <dd>{{ object.get_rating_display }}</dd>
       {% endif %}
       {% if object.measure %}

froide_govplan/templates/froide_govplan/plugins/card_cols.html

@@ -0,0 +1,42 @@
+{% load thumbnail %}
+
+<div class="card-columns">
+  {% for object in object_list %}
+    <div class="card">
+      {% if object.image %}
+        <a href="{{ object.get_absolute_url }}">
+          {% with picture=object.image %}
+            <picture>
+              {% thumbnail picture 540x0 crop=smart subject_location=picture.subject_location as thumb%}
+              <source
+                srcset="{{ thumb.url }}.avif"
+                type="image/avif"
+              />
+              <img class="card-img-top" loading="lazy" src="{{ thumb.url }}"
+                {% if picture.default_alt_text %} alt="{{ picture.default_alt_text }}"{% else %} alt=""{% endif %}
+              >
+            </picture>
+          {% endwith %}
+        </a>
+      {% endif %}
+      <div class="card-body">
+        <h5 class="card-title">
+          <a href="{{ object.get_absolute_url }}">
+            {{ object.title }}
+          </a>
+        </h5>
+        <p class="card-text">
+          {{ object.description|striptags|truncatewords:30 }}
+        </p>
+      </div>
+      <ul class="list-group list-group-flush">
+        <li class="list-group-item">
+          <strong>Status:</strong>
+          <span class="badge badge-{{ object.get_status_css }}">
+            {{ object.get_status_display }}
+          </span>
+        </li>
+      </ul>
+    </div>
+  {% endfor %}
+</div>

froide_govplan/templatetags/govplan.py

@@ -1,17 +1,9 @@
 from django import template
 
-from froide_govplan.models import PlanStatus
+from froide_govplan.models import STATUS_CSS, PlanStatus
 
 register = template.Library()
 
-STATUS_CSS = {
-    PlanStatus.NOT_STARTED: "secondary",
-    PlanStatus.STARTED: "primary",
-    PlanStatus.PARTIALLY_IMPLEMENTED: "warning",
-    PlanStatus.IMPLEMENTED: "success",
-    PlanStatus.DEFERRED: "danger",
-}
-
 
 @register.simple_tag
 def get_plan_progress(object_list):