Update templates/index.html

templates/index.html

@@ -247,6 +247,18 @@
     .bubble a,.best-answer-bubble a,.other-answer-text a,.version-text a {
       color: var(--accent); text-decoration: underline; text-underline-offset: 2px;
     }
+    .md-img {
+      display: block;
+      max-width: 100%;
+      min-width: 60px;
+      max-height: 480px;
+      width: auto;
+      height: auto;
+      border-radius: var(--radius-md);
+      border: 1px solid var(--border);
+      margin: 6px 0;
+      object-fit: contain;
+    }
     p.md-gap { min-height: 0.6em; margin: 0 !important; padding: 0; }
     /* ── Vote ── */
     .vote-row { display: flex; gap: 4px; align-items: center; margin-top: 6px; }
@@ -928,7 +940,8 @@
         out = out.replace(/\*([^*\s][^*]*[^*\s]|\S)\*/g, "<em>$1</em>");
         out = out.replace(/_([^_\s][^_]*[^_\s]|\S)_/g, "<em>$1</em>");
         out = out.replace(/~~([^~]+)~~/g, "<s>$1</s>");
-        out = out.replace(/\[([^\]]+)\]\((https?:\/\/[^\s)]+)\)/g, '<a href="$2" target="_blank" rel="noreferrer">$1</a>');
+        out = out.replace(/!\[([^\]]*)\]\((https?:\/\/[^\s)]+)\)/g, '<img class="md-img" src="$2" alt="$1" loading="lazy">');
+      out = out.replace(/\[([^\]]+)\]\((https?:\/\/[^\s)]+)\)/g, '<a href="$2" target="_blank" rel="noreferrer">$1</a>');
         return out;
       }
       function renderMarkdown(md) {