From 6abe3d87e08f1439237f5c79eee8b20091bd0cdb Mon Sep 17 00:00:00 2001
From: Ayo Ayco <ayo@ayco.io>
Date: Thu, 2 May 2024 14:42:59 +0200
Subject: [PATCH] perf: add width and height to img elements

---
 templates/threads.html | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/templates/threads.html b/templates/threads.html
index a87aff1..d989d81 100644
--- a/templates/threads.html
+++ b/templates/threads.html
@@ -90,7 +90,8 @@
             box-shadow: 5px 25px 10px -25px rgba(34, 34, 34, 0.15);
             max-width: 100%;
             margin: 15px 0 1em;
-            object-fit: cover;
+            object-fit: contain;
+            height: auto;
             text-decoration: none;
             text-wrap: balance;
           }
@@ -266,6 +267,8 @@
                     <a href="{{ media.url }}">
                       <img
                         class="media"
+                        width="{{ media.meta.small.width }}"
+                        height="{{ media.meta.small.height }}"
                         src="{{media.preview_url}}"
                         alt="{{ media.description or 'media attachment' }}"
                         title="{{ media.description or 'media attachment' }}"
@@ -337,7 +340,9 @@
                       <a href="{{ media.url }}">
                         <img
                           class="media"
-                          src="{{media.preview_url}}"
+                          width="{{ media.meta.small.width }}"
+                          height="{{ media.meta.small.height }}"
+                          src="{{ media.preview_url}} "
                           alt="{{ media.description or 'media attachment' }}"
                           title="{{ media.description or 'media attachment' }}"
                         />