From 7a2942b7e29d0b2c3ef082516a7d5d81a977e95c Mon Sep 17 00:00:00 2001
From: Zsolt Tasnadi <rastasi@gmail.com>
Date: Fri, 6 Mar 2026 18:10:10 +0100
Subject: [PATCH] subtitle for blogposts

---
 apps/frontend/src/pages/blog.astro | 35 ++++++++++++++++++++----------
 1 file changed, 23 insertions(+), 12 deletions(-)

diff --git a/apps/frontend/src/pages/blog.astro b/apps/frontend/src/pages/blog.astro
index d08727e..1f92dd0 100644
--- a/apps/frontend/src/pages/blog.astro
+++ b/apps/frontend/src/pages/blog.astro
@@ -214,12 +214,20 @@ function timeAgo(dateStr: string): string {
                     {page.title}
                   </h2>
                   
+                  {page.description && (
+                    <p class="blog-post-description">
+                      {page.description}
+                    </p>
+                  )}
+                  
                   {page.render ? (
-                    <div class="wiki-content prose prose-lg max-w-none text-gray-700 leading-relaxed" set:html={page.render} />
+                    <div class="wiki-content max-w-none text-gray-700 leading-relaxed" set:html={page.render} />
                   ) : (
-                    <div class="blog-post-fallback">
-                      {page.description || "No preview available for this post."}
-                    </div>
+                    !page.description && (
+                      <div class="blog-post-fallback">
+                        No preview available for this post.
+                      </div>
+                    )
                   )}
                 </div>
               </article>
@@ -273,10 +281,10 @@ function timeAgo(dateStr: string): string {
     @apply bg-white rounded-2xl shadow-xl border border-gray-100 overflow-hidden;
   }
   .blog-post-content {
-    @apply p-8 md:p-12;
+    @apply p-6 md:p-10;
   }
   .blog-post-meta {
-    @apply flex items-center justify-between mb-6;
+    @apply flex items-center justify-between mb-4;
   }
   .blog-post-timestamp {
     @apply flex items-center gap-2 text-xs font-semibold uppercase tracking-wider text-gray-400;
@@ -288,18 +296,21 @@ function timeAgo(dateStr: string): string {
     @apply w-1.5 h-1.5 rounded-full bg-green-500 animate-pulse;
   }
   .blog-post-title {
-    @apply text-3xl md:text-4xl font-black text-gray-900 mb-8 leading-tight;
+    @apply text-2xl md:text-3xl font-black text-gray-900 mb-4 leading-tight;
+  }
+  .blog-post-description {
+    @apply text-lg text-gray-500 mb-8 font-medium leading-relaxed;
   }
   .blog-post-fallback {
-    @apply text-gray-600 text-lg leading-relaxed whitespace-pre-wrap;
+    @apply text-gray-600 text-base leading-relaxed whitespace-pre-wrap;
   }
 </style>
 
 <style is:global>
-  .wiki-content h1 { @apply text-3xl font-bold mt-8 mb-4 text-gray-900; }
-  .wiki-content h2 { @apply text-2xl font-bold mt-6 mb-3 text-gray-800; }
-  .wiki-content h3 { @apply text-xl font-bold mt-4 mb-2 text-gray-800; }
-  .wiki-content p { @apply mb-4 text-gray-700; }
+  .wiki-content h1 { @apply text-2xl font-bold mt-8 mb-4 text-gray-900; }
+  .wiki-content h2 { @apply text-xl font-bold mt-6 mb-3 text-gray-800; }
+  .wiki-content h3 { @apply text-lg font-bold mt-4 mb-2 text-gray-800; }
+  .wiki-content p { @apply mb-4 text-gray-700 leading-relaxed; }
   .wiki-content ul { @apply list-disc ml-6 mb-4 text-gray-700; }
   .wiki-content ol { @apply list-decimal ml-6 mb-4 text-gray-700; }
   .wiki-content li { @apply mb-1; }