{% extends "base.html.twig" %}
{% block style %}
{{ parent() }}
{% include "css/shepherd.html.twig" %}
{% include "pages/headers/encore-entry-css-files.html.twig" with {file: 'homepage_css'} %}
{% include "pages/headers/encore-entry-css-files.html.twig" with {file: 'evenementavenir_css'} %}
{% include "pages/headers/encore-entry-css-files.html.twig" with {file: 'previews_css'} %}
{% include "pages/headers/encore-entry-css-files.html.twig" with {file: 'preview_thematique_css'} %}
{% include "pages/headers/encore-entry-css-files.html.twig" with {file: 'splide_css'} %}
{% endblock %}
{% block content %}
{% set thematiquesArray = [] %}
{% if app.user is defined and app.user.contact is defined %}
{% for thematiques in app.user.contact.categories %}
{% set thematiquesArray = thematiquesArray|merge([thematiques.id]) %}
{% endfor %}
{% endif %}
<div id="myHeader" class="{% if content.header_img is defined and content.header_img is not empty %}homepage-title{% else %}small-main-title{% endif %} dflex aic jcc prelative homepage-header homepage-intro example-css-selector">
{% if content.header_img is defined and content.header_img is not empty %}
{# pas de loading=lazy ici car c'est le LPC (largest painted content) qui apparaît dès l'arrivée sur le site #}
<img src="{{ content.header_img.formats['1000x.webp'] }}" srcset="{{ content.header_img.formats['300x.webp'] }} 300w, {{ content.header_img.formats['600x.webp'] }} 600w, {{ content.header_img.formats['800x.webp'] }} 800w, {{ content.header_img.formats['1000x.webp'] }} 1000w" sizes="(max-width: 300px) 300w, (max-width: 600px) 600w, (max-width: 800px) 800w, 1000w" alt="{{ content.header_img | copyright_or_description_or_title }}" width="{{ content.header_img.fileVersion.properties.width }}" height="{{ content.header_img.fileVersion.properties.height }}" loading="lazy">
{% endif %}
<div class="center w100">
<h1 {% if content.header_img is defined and content.header_img is not empty %} class="cwhite" {% endif %}>{{ content.page_title }}</h1>
<div class="mt-20px mb-20px fw500 fs20 text tac{% if content.header_img is defined and content.header_img is not empty %} cwhite{% else %} cgrey{% endif %}">{{ content.chapo|raw }}</div>
<form action="{{ path('pqna.search') }}" method="POST" class="dflex fdc aic usnone">
<div class="input-search-container prelative">
<input type="text" name="q" placeholder="Que recherchez-vous ?" class="fs16 lh24">
<button type="submit" class="pabsolute dflex aic jcc"><img src="/resources/img/search-icon.svg" alt="Rechercher" width="16" height="16" loading="lazy" style="pointer-events: none;"></button>
</div>
<div class="dflex jcc fwwrap search-button-display mt-24px" id="search-buttons-container-hp">
<div>
<input class="check_search" type="radio" id="Contractualisation-hp" name="keyword" value="Contractualisation">
<label for="Contractualisation-hp" class="fs18 fw600 cwhite lh28">Contractualisation</label>
</div>
<div>
<input class="check_search" type="radio" id="Gouvernance-hp" name="keyword" value="Gouvernance">
<label for="Gouvernance-hp" class="fs18 fw600 cwhite lh28">Gouvernance</label>
</div>
<div>
<input class="check_search" type="radio" id="Experimentation-hp" name="keyword" value="Experimentation">
<label for="Experimentation-hp" class="fs18 fw600 cwhite lh28">Expérimentation</label>
</div>
<div class="break"></div>
<div>
<input class="check_search" type="radio" id="Cooperation-hp" name="keyword" value="Cooperation">
<label for="Cooperation-hp" class="fs18 fw600 cwhite lh28">Coopération</label>
</div>
<div>
<input class="check_search" type="radio" id="Evaluation-hp" name="keyword" value="Evaluation">
<label for="Evaluation-hp" class="fs18 fw600 cwhite lh28">Évaluation</label>
</div>
</div>
</form>
</div>
{% if content.header_img is defined and content.header_img is not empty %}
<div class="background-color-blue"></div>
{% endif %}
</div>
<div class="main-container w100 plr-1em">
<div class="content">
<div class="blocks w100">
<section class="alaune mt-40px">
<h2 class="fs60 lh60 fw700 center">À la une</h2>
{% include "homepage-articles/alaune.html.twig" with {thematiques: thematiquesArray} %}
</section>
<section class="evenementsavenir mt-80px mb-40px pb-100px prelative">
<h2 class="fs60 lh60 fw700 center mb-40px">Évènements à venir</h2>
{% include "homepage-articles/evenementsavenir.html.twig" %}
</section>
<section class="presentation">
{% for block in content.main_content %}
{% if block.type == 'category_presentation' %}
{% include "homepage-articles/presentation-category.html.twig" %}
{% elseif block.type == 'partenaires_financiers' %}
{% include "homepage-articles/partenaires.html.twig" %}
{% endif %}
{% endfor %}
</section>
</div>
</div>
</div>
{% endblock %}
{% block javascripts %}
{{ parent() }}
{{ encore_entry_script_tags('splide') }}
{{ encore_entry_script_tags('onboard_tour') }}
{% endblock %}