blog post thumbnails

axum_server/templates/components/blog_post_preview.html

@@ -0,0 +1,26 @@
+<article class="grid grid-cols-[1fr_2fr] grid-flow-col gap-4">
+	<aside class="row-span-3">
+		<!-- TODO <figure> -->
+		<!-- TODO Thumbnail -->
+	  <!-- <svg aria-hidden="true" class="h-12 w-12 fill-blue-950"> -->
+	    <!-- <use xlink:href="/svg/icons-sprite.svg#mail" /> -->
+	  <!-- </svg> -->
+		<figure>
+	</aside>
+	<header>
+		<h3 class="text-lg font-bold mb-1">{{post.metadata.title}}</h3>
+	</header>
+	<section class="text-base leading-5 text-gray-800">{{post.body|description_filter|safe}}</section>
+	<footer class="text-sm">
+    <ul class="inline-block">
+     {% for tag in post.metadata.tags %}
+      <li class="inline-block">
+        <a href="/blog/tags/{{tag}}" class="text-pink-950 no-underline">#{{tag|capitalize}}</a>
+      </li>
+      {% endfor %}
+    </ul>
+		|
+    <time datetime="{{post.metadata.date}}" class="text-pink-950"> {{post.metadata.date|pretty_date}} </time>
+	</footer>
+</article>
+