From 5ffeb80959128742822818352e942449855b6b49 Mon Sep 17 00:00:00 2001
From: Maciej Pienczyn <maciej.pienczyn@inpi.pl>
Date: Sun, 15 Mar 2026 09:03:32 +0100
Subject: [PATCH] fix: improve ZOPK news image loading with no-referrer policy

- Add referrerpolicy="no-referrer" to img tags to bypass hotlink
  protection on source servers
- Replace Google Favicons fallback (blocked) with inline domain
  initial letter in green placeholder
- Consistent styling across index and news_list templates

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 templates/zopk/index.html     | 13 ++++++++++---
 templates/zopk/news_list.html | 13 ++++++++++---
 2 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/templates/zopk/index.html b/templates/zopk/index.html
index aa666e6..fda984b 100644
--- a/templates/zopk/index.html
+++ b/templates/zopk/index.html
@@ -263,6 +263,13 @@
         flex-shrink: 0;
     }
 
+    .news-source-initial {
+        font-size: 28px;
+        font-weight: 700;
+        opacity: 0.8;
+        text-transform: uppercase;
+    }
+
     .news-content h4 {
         font-size: var(--font-size-lg);
         margin-bottom: var(--spacing-sm);
@@ -1316,14 +1323,14 @@
         {% for news in news_items %}
         <a href="{{ news.url }}" target="_blank" rel="noopener" class="news-card">
             {% if news.image_url %}
-            <img src="{{ news.image_url }}" alt="" class="news-image"
+            <img src="{{ news.image_url }}" alt="" class="news-image" referrerpolicy="no-referrer"
                  onerror="this.onerror=null; this.style.display='none'; this.nextElementSibling.style.display='flex';">
             <div class="news-placeholder" style="display:none;">
-                <img src="https://www.google.com/s2/favicons?domain={{ news.source_domain or 'nordabiznes.pl' }}&amp;sz=128" alt="" style="width:32px;height:32px;opacity:0.6;">
+                <span class="news-source-initial">{{ (news.source_domain or 'N')[0]|upper }}</span>
             </div>
             {% else %}
             <div class="news-placeholder">
-                <img src="https://www.google.com/s2/favicons?domain={{ news.source_domain or 'nordabiznes.pl' }}&amp;sz=128" alt="" style="width:32px;height:32px;opacity:0.6;">
+                <span class="news-source-initial">{{ (news.source_domain or 'N')[0]|upper }}</span>
             </div>
             {% endif %}
             <div class="news-content">
diff --git a/templates/zopk/news_list.html b/templates/zopk/news_list.html
index c44b1b6..55374f3 100644
--- a/templates/zopk/news_list.html
+++ b/templates/zopk/news_list.html
@@ -83,6 +83,13 @@
         color: white;
     }
 
+    .news-source-initial {
+        font-size: 28px;
+        font-weight: 700;
+        opacity: 0.8;
+        text-transform: uppercase;
+    }
+
     .news-content h3 {
         font-size: var(--font-size-lg);
         margin-bottom: var(--spacing-sm);
@@ -179,14 +186,14 @@
     {% for news in news_items %}
     <a href="{{ news.url }}" target="_blank" rel="noopener" class="news-card">
         {% if news.image_url %}
-        <img src="{{ news.image_url }}" alt="" class="news-image"
+        <img src="{{ news.image_url }}" alt="" class="news-image" referrerpolicy="no-referrer"
              onerror="this.onerror=null; this.style.display='none'; this.nextElementSibling.style.display='flex';">
         <div class="news-placeholder" style="display:none;">
-            <img src="https://www.google.com/s2/favicons?domain={{ news.source_domain or 'nordabiznes.pl' }}&amp;sz=128" alt="" style="width:32px;height:32px;opacity:0.6;">
+            <span class="news-source-initial">{{ (news.source_domain or 'N')[0]|upper }}</span>
         </div>
         {% else %}
         <div class="news-placeholder">
-            <img src="https://www.google.com/s2/favicons?domain={{ news.source_domain or 'nordabiznes.pl' }}&amp;sz=128" alt="" style="width:32px;height:32px;opacity:0.6;">
+            <span class="news-source-initial">{{ (news.source_domain or 'N')[0]|upper }}</span>
         </div>
         {% endif %}
         <div class="news-content">