beautify the post list page

content/posts/19700101_hello.md

@@ -3,6 +3,7 @@ title   Hello, world
 date    1970-01-01T00:00+00:00
 category test
 abstract
+author Bob
 ---
 {
 

content/posts/post1.md

@@ -3,7 +3,7 @@ title   R&D et Veille techno - Petit point sur nos projets internes
 date    2024-07-11T08:33:06+00:00
 category Technologie
 abstract Un petit tour d'horizon des projets sur lesquels nos équipes techniques travaillent actuellement ...
-
+author Damien ACCORSI
 ---
 {
 

content/posts/post2.md

@@ -3,6 +3,7 @@ title   Microsoft deviendrait-il un spyware avec la fonctionnalité Recall ?
 date    2024-05-22T12:36:09+00:00
 category Technologie
 abstract Le 20 mai 2024, Microsoft annonce la fonctionnalité Recall qui va "aider les utilisateurs à trouver leurs informations" en s'appuyant sur l'IA ...
+author Damien ACCORSI
 ---
 {
 

content/posts/post3.md

@@ -3,6 +3,7 @@ title   Venez échanger sur les sujets de collaboration d'équipe et e-mail aux
 date    2024-05-20T16:20:03+00:00
 category Univers du libre
 abstract Algoo sera présente et très active aux JDLL 2024 : stand, ateliers et conférence !
+author Damien ACCORSI
 ---
 {
 

content/templates/jinja2/post-list.html

@@ -1,18 +1,61 @@
-{% extends "base.html" %}
+{% extends "base.html"%}
 {% block content %}
 
 <div class="container">
 <nav class='navbar navbar-light bg-light static-top'>
 <a>Catégories :</a>
 <a href='/posts/'>Tout</a>
 {% for category in object.categories %}
-    <a href='/posts/category/{{category}}.html'>{{ category }}</a>
+    <a href='/posts/category/{{category}}.html'>{{ category|replace('-', ' ')|title }}</a>
 {% endfor %}
 </nav>
 </div>
 
+<div class="row" id="articles">
 {% for post in object.posts %}
-    <a href='/posts/{{post.slug}}.html'>{{ post.timestamp.strftime("%d/%m/%Y") }} : {{ post.title }} : {{ post.metadata.abstract }}</a> <br>
+  <div class="col-12 col-lg-4  my-2 blog__article " id="r-d-et-veille-techno-petit-point-sur-nos-projets-internes">
+    <div class="blog__post card rounded-20 " style="max-width: ; min-width: ">
+      <div class="card-body">
+        <div class="card-text" style="height: 400px">
+
+          <a class="card-link footer-link" href="/posts/{{post.slug}}.html">
+            <h2 class="blog__post__text__title">{{ post.title }}</h2>
+          </a>
+
+          <div class="blog__post__text__content">
+            <p>{{ post.metadata.abstract }}</p>
+          </div>
+
+          <div class="blog__post__text__bottom">
+            <div class="blog__post__text__bottom__meta">
+              <div class="blog__post__text__bottom__meta__author">
+                <div class="blog__post__text__bottom__meta__author__icon"><i class="fas fa-user"></i></div>
+                <div class="blog__post__text__bottom__meta__author__name">{{post.metadata.author}}</div>
+              </div>
+
+              <div class="blog__post__text__bottom__meta__date">
+                <div class="blog__post__text__bottom__meta__date__icon"><i class="fas fa-calendar"></i></div>
+                <div class="blog__post__text__bottom__meta__date__name">{{ post.timestamp.strftime("%d/%m/%Y") }}</div>
+              </div>
+            </div>
+
+            <div class="blog__post__text__bottom__btn">
+              <a
+                class="btn btn-primary btn-round"
+                href="/posts/{{post.slug}}.html"
+              >
+                Lire la suite ...
+              </a>
+            </div>
+          </div>
+          <div class="blog__post__text__meta__category d-none">
+            {{post.metadata.abstract}}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
 {% endfor %}
+</div>
 
 {% endblock %}

content/templates/jinja2/post.html

@@ -5,4 +5,5 @@
 
 <h1>{{ object.title }}</h1>
 {{ object.content|safe }}
+<a href="/posts">Tous les posts</a>
 {% endblock %}

jssg/models.py

@@ -299,7 +299,7 @@ class Sitemap :
     posts_slugs = [p["slug"] for p in Post.get_posts()]
 
 class PostList :
-    metadata = {}
+    metadata = {"page_header_h1":"Posts"}
     category = ""
 
     def __init__(self, category = "") -> None:

tsconfig.json

@@ -30,6 +30,12 @@
       "@t:jssg/*": [
         "./jssg/templates/jssg/*"
       ],
+      "@s:django_jinja_markdown/*": [
+        "./env/lib/python3.9/site-packages/django_jinja_markdown/static/django_jinja_markdown/*"
+      ],
+      "@t:django_jinja_markdown/*": [
+        "./env/lib/python3.9/site-packages/django_jinja_markdown/templates/django_jinja_markdown/*"
+      ],
       "@s:django_distill/*": [
         "./env/lib/python3.9/site-packages/django_distill/static/django_distill/*"
       ],