feat: ajoute une première actualité (choix avocat)

.eleventy.js

@@ -45,6 +45,8 @@ module.exports = function(eleventyConfig) {
 
   eleventyConfig.setLibrary('md', markdownIt(markdownItOptions).use(markdownItAttrs))
 
+  eleventyConfig.setFrontMatterParsingOptions({ excerpt: true });
+
   return {
     dir: {
       input: 'src'

.eleventyignore

@@ -1,6 +1,5 @@
 src/familles/
 src/familles.njk
 src/infos/on-parle-de-nous.md
-src/infos/actualites.md
 src/infos/historique.md
 src/infos/idees-recues/idees-recues-a-faire.md

src/_includes/actualites.njk

@@ -1,15 +0,0 @@
-{% set actualites = [] %}
-<ol class="liste-familles">
-    {% for actualite in actualites %}
-        <li class="famille-item{% if actualite.url == url %} famille-item-active{% endif %}">
-            <a href="{{ actualite.url | url }}" class="famille-link">
-                {% if actualite.data.nom %}
-                    {{ actualite.data.nom }}
-                {% else %}
-                    <code>{{ actualite.url }}</code>
-                {% endif %}
-            </a>
-            <time class="liste-famille-date" datetime="{{ actualite.date | htmlDateString }}">{{ actualite.date | readableDate }}</time>
-        </li>
-    {% endfor %}
-</ol>

src/_includes/layouts/actualite.njk

@@ -6,3 +6,6 @@ templateClass: tmpl-post
 <time datetime="{{ page.date | htmlDateString }}">{{ page.date | readableDate }}</time>
 
 <p>{{ content | safe }}</p>
+
+<img class="max-w-96 mx-auto mt-8 px-16" src="{{ image }}" />
+

src/actualites.njk

@@ -0,0 +1,25 @@
+---
+title: Actualités
+layout: layouts/base.njk
+eleventyNavigation:
+  key: Actualités
+  order: 2
+---
+
+{% set liste = collections.actualites %}
+
+<ol class="lg:grid lg:gap-4 lg:grid-cols-3 flex">
+  {% for actualite in liste %}
+    <li class="{% if actualite.url == url %} famille-item-active{% endif %}">
+      <a href="{{ actualite.url | url }}" class="no-underline">
+        <div class="flex flex-col border-2 border-amber-900 bg-amber-900 rounded-lg m-2 text-white drop-shadow-md">
+          <span class="m-2 font-bold">{{ actualite.data.title }}</span>
+          <img src="{{actualite.data.image}}" />
+          <blockquote class="text-sm m-2">{{ actualite.data.page.excerpt  }}</blockquote>
+          <time class="bg-white text-amber-800 rounded-b-lg px-4 py-1 text-center" datetime="{{ actualite.date | htmlDateString }}">{{ actualite.date | readableDate }}</time>
+        </div>
+      </a>
+    </li>
+  {% endfor %}
+</ol>
+

src/actualites/2022-07-25-choix-avocat.md

@@ -1,8 +1,7 @@
 ---
-title: 'Nous publions un guide pour aider à choisir un avocat'
+title: Nous publions un guide pour aider à choisir un avocat
-metaTitle: 'Nous publions un guide pour aider à choisir un avocat'
+metaTitle: Nous publions un guide pour aider à choisir un avocat
-metaDesc: 'Nous publions un guide pour aider à choisir un avocat'
+metaDesc: Nous publions un guide pour aider à choisir un avocat
-permalink: /actualites/2022-07-25/choix-avocat/
 image: /actualites/images/choix-avocat.jpg
 date: 2022-07-25T11:00:00.000Z
 tags:
@@ -11,8 +10,9 @@ tags:
 
 De nombreuses familles confrontées à un refus d’autorisation doivent recourir à  un.e avocat.e pour défendre leur droit à instruire leur(s) enfant(s) hors école. Or si Internet regorge de guides pour aider à choisir un.e avocat.e, aucun n’a été pensé pour notre situation spécifique et inédite...
 
+---
+
 NonSco’llectif s'est penché sur la question et partage ici son point de vue, espérant faciliter cette décision pour les autres familles, collectifs et associations.
 
 [Ouvrir](/dl/Guide-Choix-avocat-NonScollectif.pdf){.centered-button target=_blank}
 
-![](/actualites/images/choix-avocat.jpg){.max-w-96 .mx-auto .mt-8 .px-16}

src/index.njk

@@ -30,3 +30,23 @@ layout: layouts/home.njk
 
 Dans les médias et sur les réseaux, on <a href="/on-parle-de-nous">parle de nous</a> !
 #}
+
+{% set liste = collections.actualites %}
+
+<ol class="flex flex-col">
+    {% for actualite in liste %}
+        <li class="{% if actualite.url == url %} famille-item-active{% endif %}">
+            <a href="{{ actualite.url | url }}" class="no-underline">
+                <div class="flex flex-col md:flex-row bg-amber-900 rounded-xl m-2 text-white drop-shadow-md p-0 overflow-hidden relative">
+                    <time class="absolute bottom-0 text-bold text-sm right-0 bg-white text-amber-800 px-4 py-1 text-center" datetime="{{ actualite.date | htmlDateString }}">{{ actualite.date | readableDate }}</time>
+                    <img class="hidden  w-48 md:block  md:rounded-none mx-auto" src="{{actualite.data.image}}" />
+                    <div class="flex flex-col">
+                        <span class="m-2 font-bold">{{ actualite.data.title }}</span>
+                        <blockquote class="text-sm m-2">{{ actualite.data.page.excerpt  }}</blockquote>
+                    </div>
+                </div>
+            </a>
+        </li>
+    {% endfor %}
+</ol>
+

src/infos/actualites.md

@@ -1,11 +0,0 @@
----
-title: Actualités
-permalink: /actualites/
-eleventyNavigation:
-  key: Actualités
-  order: 1
----
-
-# Actualités
-
-Annonce des actions, annonce des sorties de nouvelles vidéos, nouveaux témoignages, etc.