mooooar moooar pretty fixes

axum_server/templates/components/blog_post_preview.html

@@ -1,4 +1,4 @@
-<article class="grid grid-cols-[max-content_1fr] grid-rows-[max-content_1fr_max-content] grid-flow-col gap-4 md:gap-x-8">
+<article class="grid grid-cols-[max-content_1fr] grid-rows-[max-content_1fr_max-content] grid-flow-col gap-4 md:gap-x-8 break-inside-avoid">
 	<aside class="row-span-3 self-center">
 		{% match post.metadata.thumbnail %}
 		{% when Some with (orig_path) %}
@@ -14,7 +14,7 @@
 		  <a rel="prefetch" href="/blog/{{post.slug}}" class="text-blue-950 no-underline">{{post.metadata.title}}</a>
 		</h3>
 	</header>
-	<section class="text-base leading-5 text-gray-800 md:text-xl text-justify">{{post.body|description_filter|safe}}</section>
+	<section class="text-base leading-5 text-slate-800 md:text-xl text-justify">{{post.body|description_filter|safe}}</section>
 	<footer class="text-sm md:text-base lg:text-lg">
     <ul class="inline-block">
      {% for tag in post.metadata.tags %}

axum_server/templates/components/project_preview_card.html

@@ -1,4 +1,4 @@
-<article class="border rounded-md bg-white m-4 p-4">
+<article class="border rounded-md bg-white m-4 p-4 break-inside-avoid">
   <header class="px-4 mb-3"> 
     <h2 class="text-xl font-semibold text-blue-900 md:text-2xl">
       {% match project.metadata.link %}
@@ -18,16 +18,17 @@
 
   {% match project.metadata.cover_image %}
   {% when Some with (source) %}
-  <figure class="mx-4 my-2">
+  {% let picture = crate::picture_generator::picture_markup_generator::generate_picture_markup(source, 420, 236, "Project cover", true).unwrap_or("cover not found".to_string()) %}
+  <figure class="mx-4 my-2 flex justify-center">
       {% match project.metadata.link %}
       {% when Some with (href) %}
       <a href="{{href}}">
-        <img src="{{source}}" class="object-contain w-full aspect-video"/>
+       {{picture|safe}}
       </a>
       {% when None %}
-      <img src="{{source}}" />
+       {{picture|safe}}
       {% endmatch %}
-		<!-- TODO <figure> -->
+		<!-- TODO <figure> generate_image -->
   </figure>
   {% when None %}
   {% endmatch %}

axum_server/templates/components/talent_card.html

@@ -10,7 +10,7 @@
 		<header>
 			<h3 class="text-lg font-medium mb-1 md:text-2xl">{{heading}}</h3>
 		</header>
-		<p class="text-sm leading-5 text-gray-800 md:text-lg">{{description|safe}}</p>
+		<p class="text-sm leading-5 text-slate-800 md:text-lg">{{description|safe}}</p>
 	</section>
 </section>