feat: expand author widget to article stats (words, reading time, type)

1 files changed, 40 insertions, 5 deletions

diff --git a/layouts/partials/sidebar.html b/layouts/partials/sidebar.html
index a2225f1..2db058f 100644
--- a/layouts/partials/sidebar.html
+++ b/layouts/partials/sidebar.html
@@ -1,10 +1,45 @@
 <aside class="order-last md:order-none md:col-span-1">
-  <!-- Author info widget (optional - can be expanded) -->
+  <!-- Article stats widget -->
   <div class="sidebar-widget">
-    <p class="sidebar-widget-label"># {{ i18n "author" }}</p>
-    <p class="text-text-dim text-sm leading-relaxed">
-      {{ .Site.Params.author }}
-    </p>
+    <p class="sidebar-widget-label"># {{ i18n "articleStats" }}</p>
+
+    {{ if .Params.image }}
+    <img
+      src="{{ .Params.image }}"
+      alt="{{ .Title }}"
+      loading="lazy"
+      class="w-full rounded mb-4 object-cover max-h-40"
+    >
+    {{ end }}
+
+    <ul class="space-y-2 text-sm text-text-dim">
+      <li class="flex items-center gap-2">
+        <i data-feather="user" class="w-4 h-4 shrink-0"></i>
+        <span>{{ .Site.Params.author }}</span>
+      </li>
+      <li class="flex items-center gap-2">
+        <i data-feather="file-text" class="w-4 h-4 shrink-0"></i>
+        <span>{{ .WordCount }} {{ i18n "words" }}</span>
+      </li>
+      {{ if .Site.Params.readingTime }}
+      <li class="flex items-center gap-2">
+        <i data-feather="clock" class="w-4 h-4 shrink-0"></i>
+        <span>{{ .ReadingTime }} {{ i18n "min" }} {{ i18n "readingTime" }}</span>
+      </li>
+      {{ end }}
+      {{ $articleType := .Params.type | default "" }}
+      {{ $typeConfig := .Site.Params.articleTypes }}
+      {{ $typeData := index $typeConfig $articleType }}
+      {{ if and $typeData $articleType }}
+      <li class="flex items-center gap-2">
+        <i data-feather="tag" class="w-4 h-4 shrink-0"></i>
+        <span
+          class="inline-flex items-center px-2 py-0.5 rounded text-xs font-mono font-semibold"
+          style="background-color: var(--type-{{ $articleType }}); color: var(--type-{{ $articleType }}-text);"
+        >{{ i18n $articleType }}</span>
+      </li>
+      {{ end }}
+    </ul>
   </div>
 
   <hr class="sidebar-hr">