related blogs style fixes

djnd/home/templates/home/blog_page.html

@@ -21,7 +21,7 @@
         {% endfor %}
       </div>
       {% endif %}
-        
+
       <h1 class="text-5xl font-semibold xl-max:text-2xl">{{ page.title }}</h1>
       <!-- <div class="rich-text">
           {{ value.text|richtext }}
@@ -50,15 +50,7 @@ <h2 class="text-2xl font-semibold mb-3 xl-max:text-lg">{% translate "Povezani za
   <div class="flex gap-10 max-w-[1280px] mx-auto px-14 pb-10 sm-max:px-6 sm-max:pb-5">
     <div class="grid grid-cols-3 gap-4 sm-max:grid-cols-1">
         {% for blog in page.more_blogs %}
-        <div class="border border-dark">
-            <a href="{{ blog.value.link }}" target="_blank">
-            {% image blog.value.thumbnail width-300 class="w-full h-[180px] object-cover" %}
-            </a>
-            <div class="border-t border-dark p-5 pb-2">
-              <a href="{{ blog.value.link }}" target="_blank" class="block text-2xl font-semibold mb-3 bg-left-bottom bg-[length:0%_0.5em] bg-no-repeat bg-gradient-to-r from-th-primary to-th-primary group-hover:bg-[length:100%_0.5em] transition-all duration-500 ease-out">{{ blog.value.title }}</a>
-              <p class="mb-6">{{ blog.value.short_description }}</p>
-            </div>
-        </div>
+          {% include "home/partials/blog_activity.html" with activity=blog.value %}
         {% endfor %}
     </div>
   </div>

djnd/home/templates/home/newsletter_page.html

@@ -65,15 +65,7 @@ <h2 class="text-2xl font-semibold xl-max:text-lg">{% translate "Izpostavljeno" %
     <p class="text-md mb-8">{% translate "Priporočamo, svetujemo, vabimo, opozarjamo in še kaj drugega" %}</p>
     <div class="grid grid-cols-3 gap-4 sm-max:grid-cols-1">
         {% for article in page.promoted %}
-        <div class="border border-dark">
-            <a href="{{ article.value.link }}" target="_blank">
-              {% image article.value.image width-300 class="w-full h-[180px] object-cover" %}
-            </a>
-            <div class="border-t border-dark p-5 pb-2">
-              <a href="{{ article.value.link }}" target="_blank" class="block text-lg font-semibold mb-2 bg-left-bottom bg-[length:0%_0.5em] bg-no-repeat bg-gradient-to-r from-th-primary to-th-primary group-hover:bg-[length:100%_0.5em] transition-all duration-500 ease-out">{{ article.value.name }}</a>
-              <p class="text-sm mb-6">{{ article.value.description }}</p>
-            </div>
-        </div>
+          {% include "home/partials/blog_activity.html" with activity=article.value %}
         {% endfor %}
     </div>
   </div>

djnd/home/templates/home/partials/blog_activity.html

@@ -0,0 +1,24 @@
+{% load i18n static wagtailcore_tags wagtailimages_tags djnd_extras %}
+
+<div class="border border-dark flex flex-col relative">
+  <a href="{% if activity|is_page %}{% pageurl activity %}{% else %}{{ activity.link }}{% endif %}" target="_blank" class="peer">
+    {% if activity.thumbnail %}
+    {% image activity.thumbnail fill-1200x630 class="w-full h-auto object-cover" %}
+    {% elif activity.image %}
+    {% image activity.image fill-1200x630 class="w-full h-auto object-cover" %}
+    {% endif %}
+  </a>
+  <div class="border-t border-dark p-5 flex-grow peer-hover:bg-th-primary-light">
+    <div class="mb-4">
+      {% firstof activity.name activity.title as blog_title %}
+      <a href="{% if activity|is_page %}{% pageurl activity %}{% else %}{{ activity.link }}{% endif %}" target="_blank"
+        class="
+          text-lg/[1.15] font-semibold
+          bg-right-bottom bg-[length:0%_0.5em] bg-no-repeat bg-gradient-to-r from-th-primary to-th-primary hover:bg-left-bottom hover:bg-[length:100%_0.5em] transition-[background-size] duration-700 ease-out
+        "
+      >{{ blog_title }}</a>
+    </div>
+    {% firstof activity.short_description activity.description as blog_description %}
+    <p class="text-sm/[22px]">{{ blog_description }}</p>
+  </div>
+</div>

djnd/home/templatetags/djnd_extras.py

@@ -1,5 +1,5 @@
 from django import template
-from wagtail.models import Locale
+from wagtail.models import Locale, Page
 
 register = template.Library()
 
@@ -32,6 +32,7 @@ def get_translated_m2m_ids(value, field_name):
 
     return [obj.id for obj in getattr(value, field_name).all()]
 
+
 @register.filter
 def has_english_translation(value, field_name):
     if field_name == "en":
@@ -41,9 +42,14 @@ def has_english_translation(value, field_name):
         return True
 
 
+@register.filter
+def is_page(value):
+    return isinstance(value, Page)
+
+
 @register.filter
 def debug_print(value):
-    print(value)
+    print(f"~~{value}~~")
     print(type(value))
     # print(vars(value))
     return value