<div id="extrait-publique" class="container">
  {% set utilite = { items: {'@page.children': '/projets/publique'} } %}
  {% for p in page.collection(utilite).order('date', 'desc').slice(0, 4) %}
    {% block extrait_cards_publiques %}
      {% include 'partials/projet_card.html.twig' %}
    {% endblock %}
  {% endfor %}
  <div>
    <a href="/projets?filter=publique" class="projets-link-filter">
      <p><span>Consulter tous nos projets</span></p>
      <p><span>d'utilité <i id="publique-link">publique</i></span><span class="picto" data-src="{{ url('theme://images/pictos/arrow-right.svg') }}" aria-hidden="true"></span></p>
    </a>
  </div>
</div>
<div id="extrait-sociale" class="container">
  {% set utilite = { items: {'@page.children': '/projets/sociale'} } %}
  {% for p in page.collection(utilite).order('date', 'desc').slice(0, 4) %}
    {% block extrait_cards_sociales %}
      {% include 'partials/projet_card.html.twig' %}
    {% endblock %}
  {% endfor %}
  <div>
    <a href="/projets?filter=sociale" class="projets-link-filter">
      <p><span>Consulter tous nos projets</span></p>
      <p><span>d'utilité <i id="sociale-link">sociale</i></span><span class="picto" data-src="{{ url('theme://images/pictos/arrow-right.svg') }}" aria-hidden="true"></span></p>
    </a>
  </div>
</div>
<div id="extrait-culturelle" class="container">
  {% set utilite = { items: {'@page.children': '/projets/culturelle'} } %}
  {% for p in page.collection(utilite).order('date', 'desc').slice(0, 4) %}
    {% block extrait_cards_culturelles %}
      {% include 'partials/projet_card.html.twig' %}
    {% endblock %}
  {% endfor %}
  <div>
    <a href="/projets?filter=culturelle" class="projets-link-filter">
      <p><span>Consulter tous nos projets</span></p>
      <p><span>d'utilité <i id="culturelle-link">culturelle</i></span><span class="picto" data-src="{{ url('theme://images/pictos/arrow-right.svg') }}" aria-hidden="true"></span></p>
    </a>
  </div>
</div>
