Resolve page bundle image paths correctly

- Use Hugo Resources API to resolve image paths for page bundles
- For images in the same directory as index.md, use image = "filename.jpg"
- Template automatically resolves to correct permalink (/articles/slug/filename.jpg)
- Falls back to literal image path if resource not found (for external URLs)

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>

1 files changed, 12 insertions, 2 deletions

diff --git a/themes/danix-xyz-hacker/layouts/partials/article-list-item.html b/themes/danix-xyz-hacker/layouts/partials/article-list-item.html
index 47f3109..e491125 100644
--- a/themes/danix-xyz-hacker/layouts/partials/article-list-item.html
+++ b/themes/danix-xyz-hacker/layouts/partials/article-list-item.html
@@ -3,12 +3,22 @@
 {{ $typeData := index $typeConfig $articleType }}
 {{ $excerpt := .Description | default .Summary }}
 
+{{ $imageURL := "" }}
+{{ if .Params.image }}
+  {{ $resource := .Resources.GetMatch .Params.image }}
+  {{ if $resource }}
+    {{ $imageURL = $resource.RelPermalink }}
+  {{ else }}
+    {{ $imageURL = .Params.image }}
+  {{ end }}
+{{ end }}
+
 <article class="border border-border/30 rounded-lg overflow-hidden hover:border-accent/50 transition-all duration-200 group">
   <!-- Thumbnail -->
-  {{ if .Params.image }}
+  {{ if $imageURL }}
   <a href="{{ .RelPermalink }}" class="block overflow-hidden bg-surface/50" tabindex="-1">
     <img
-      src="{{ .Params.image }}"
+      src="{{ $imageURL }}"
       alt="{{ .Title }}"
       class="w-full aspect-video object-cover group-hover:scale-105 transition-transform duration-200"
       loading="lazy"