---
layout: layouts/home.njk
---

{#
<h2>Actualités</h2>

<ul>
    <li>une dernière actu</li>
    <li>une dernière actu</li>
    <li>une dernière actu</li>
</ul>

<a href="/actualites">Toutes les actus</a>
#}

{#
<h2>Dernières familles</h2>

{% set listeFamilles = collections.familles | reverse | head(3) %}
{% include "familles.njk" %}

<p>Toutes les <a href="{{ '/familles/' | url }}">familles</a>.</p>
#}


{#
<h2>On parle de nous</h2>


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>