From 4a2fd8c519bb378a60bb07f2303e7b280254ed08 Mon Sep 17 00:00:00 2001
From: ZhymabekRoman <robanokssamit@yandex.ru>
Date: Sat, 25 Jan 2025 12:03:06 +0500
Subject: [PATCH] moreee image referrer policy

---
 web/server/templates/post.html | 39 +++++++++++++++++++---------------
 1 file changed, 22 insertions(+), 17 deletions(-)

diff --git a/web/server/templates/post.html b/web/server/templates/post.html
index aa7d510..e390b0d 100644
--- a/web/server/templates/post.html
+++ b/web/server/templates/post.html
@@ -1,9 +1,9 @@
-<div class="container w-full md:max-w-3xl mx-auto pt-20 break-words text-gray-900 dark:text-gray-200 bg-white dark:bg-gray-800">
-    <div class="w-full px-4 md:px-6 text-xl text-gray-800 dark:text-gray-100 leading-normal" style="font-family:Georgia,serif;">
+<div class="container w-full pt-20 mx-auto text-gray-900 break-words bg-white md:max-w-3xl dark:text-gray-200 dark:bg-gray-800">
+    <div class="w-full px-4 text-xl leading-normal text-gray-800 md:px-6 dark:text-gray-100" style="font-family:Georgia,serif;">
         {% if enable_ads_header %}<div class="pt-8"></div>{% endif %}
         <div class="font-sans">
-            <p class="text-base md:text-sm text-green-500 font-bold pb-3">
-                <a href="{{ url }}#bypass" class="text-sm md:text-sm text-green-500 font-bold no-underline hover:underline ">&lt; Go to the original</a>
+            <p class="pb-3 text-base font-bold text-green-500 md:text-sm">
+                <a href="{{ url }}#bypass" class="text-sm font-bold text-green-500 no-underline md:text-sm hover:underline ">&lt; Go to the original</a>
             </p>
             {% if previewImageId %}
                 <img alt="Preview image"
@@ -11,20 +11,23 @@
                             width: auto;
                             margin: auto"
                      loading="eager"
+                     referrerpolicy="no-referrer"
                      role="presentation"
                      src="https://miro.medium.com/v2/resize:fit:700/{{ previewImageId }}">
             {% endif %}
-            <h1 class="font-bold font-sans break-normal text-gray-900 dark:text-gray-100 pt-6 pb-2 text-3xl md:text-4xl">{{ title }}</h1>
-            {% if subtitle %}<h2 class="font-medium font-sans break-normal text-gray-600 dark:text-gray-200 pt-1 text-1xl md:text-1xl">{{ subtitle }}</h2>{% endif %}
+            <h1 class="pt-6 pb-2 font-sans text-3xl font-bold text-gray-900 break-normal dark:text-gray-100 md:text-4xl">{{ title }}</h1>
+            {% if subtitle %}<h2 class="pt-1 font-sans font-medium text-gray-600 break-normal dark:text-gray-200 text-1xl md:text-1xl">{{ subtitle }}</h2>{% endif %}
         </div>
-        <div class="bg-gray-100 dark:bg-gray-600 border border-gray-300 m-2 mt-5">
-            <div class="flex items-center space-x-4 p-4">
+        <div class="m-2 mt-5 bg-gray-100 border border-gray-300 dark:bg-gray-600">
+            <div class="flex items-center p-4 space-x-4">
                 <div class="flex-shrink-0">
-                    <a href="https://medium.com/@{{ creator.username }}" target="_blank" title="{{ creator.bio }}" class="block relative">
+                    <a href="https://medium.com/@{{ creator.username }}" target="_blank" title="{{ creator.bio }}" class="relative block">
                         <img src="https://miro.medium.com/v2/resize:fill:88:88/{{ creator.imageId or '1*dmbNkD5D-u45r44go_cf0g.png' }}"
                              alt="{{ creator.name }}"
+                             loading="eager"
+                             referrerpolicy="no-referrer"
                              class="rounded-full h-11 w-11 no-lightense">
-                        <div class="absolute bottom-0 right-0 h-3 w-3 border-2 border-white bg-green-500 rounded-full"></div>
+                        <div class="absolute bottom-0 right-0 w-3 h-3 bg-green-500 border-2 border-white rounded-full"></div>
                     </a>
                 </div>
                 <div class="flex-grow">
@@ -32,7 +35,7 @@
                        target="_blank"
                        title="{{ creator.bio }}"
                        class="block font-semibold text-gray-900 dark:text-white">{{ creator.name }}</a>
-                    <button class="text-sm text-white bg-green-500 px-3 py-1 rounded-lg mt-1 dark:bg-green-700">
+                    <button class="px-3 py-1 mt-1 text-sm text-white bg-green-500 rounded-lg dark:bg-green-700">
                         <a href="https://medium.com/@{{ creator.username }}"
                            target="_blank"
                            title="{{ creator.bio }}"
@@ -47,9 +50,11 @@
                            title="{{ collection.shortDescription }}"
                            target="_blank"
                            class="flex items-center space-x-1">
-                            <img src="https://miro.medium.com/v2/resize:fill:48:48/{{ collection.avatar.id }}"
+                            <img loading="eager"
+                                 referrerpolicy="no-referrer"
+                                 src="https://miro.medium.com/v2/resize:fill:48:48/{{ collection.avatar.id }}"
                                  alt="{{ collection.name }}"
-                                 class="h-4 w-4 rounded-full no-lightense">
+                                 class="w-4 h-4 rounded-full no-lightense">
                             <p>{{ collection.name }}</p>
                         </a>
                         <span>·</span>
@@ -62,13 +67,13 @@
                 </div>
             </div>
         </div>
-        <div class="main-content mt-8">
+        <div class="mt-8 main-content">
             {% for paragraph in content %}{{ paragraph }}{% endfor %}
         </div>
         <div class="flex flex-wrap gap-2 mt-5">
-            {% for tag in tags %}<a title="{{ tag.displayTitle }}" target="_blank" href="https://medium.com/tag/{{ tag.normalizedTagSlug }}"><span class="text-green-500 bg-green-100 px-2 py-1 rounded-full text-xs dark:bg-green-800 dark:text-gray-100">#{{ tag.normalizedTagSlug }}</span></a>{% endfor %}
+            {% for tag in tags %}<a title="{{ tag.displayTitle }}" target="_blank" href="https://medium.com/tag/{{ tag.normalizedTagSlug }}"><span class="px-2 py-1 text-xs text-green-500 bg-green-100 rounded-full dark:bg-green-800 dark:text-gray-100">#{{ tag.normalizedTagSlug }}</span></a>{% endfor %}
         </div>
-        <div class="container w-full md:max-w-3xl mx-auto pt-12"></div>
+        <div class="container w-full pt-12 mx-auto md:max-w-3xl"></div>
     </div>
     <style>
 .main-content {
@@ -90,7 +95,7 @@ document.addEventListener('DOMContentLoaded', (event) => {
   document.querySelectorAll('pre code').forEach((el) => {
         code = el.textContent;
         el = el.parentElement;
-        el.innerHTML = '<button class="hljs-copy p-1 bg-gray-300 dark:bg-zinc-800">Copy</button>' + el.innerHTML; // append copy button
+        el.innerHTML = '<button class="p-1 bg-gray-300 hljs-copy dark:bg-zinc-800">Copy</button>' + el.innerHTML; // append copy button
         el.getElementsByClassName('hljs-copy')[0].contentCopy = code;
          el.getElementsByClassName('hljs-copy')[0].addEventListener("click", function () {
              this.innerText = 'Copying..';