@JLuc Il fallait le trouver quand même, @touti en tout cas un grand merci pour ces conseils, qui nous ont permis de réaliser cette chronologie qui nous servira de modèle pour d’autres articles.
Ce que nous avons pas dit non plus c’est que avec la valeur {8} nous avons pu mettre en ordre chronologique en fonction des années d’adoption des traités.
Code définitif - chronologie.html
<div class="chrono"> <!--mise en forme du contenu -->
<B_documents_joints> <!-- début de la boucle -->
<BOUCLE_csv(DOCUMENTS){id_article}{extension=csv}{par num titre}{0,1}> #SET{source_csv,#FICHIER} </BOUCLE_csv>
<BOUCLE_chrono(DATA){source csv, #GET{source_csv}}
{par /8}]
{"<br>"}>
<!-- Bloc date -->
<div class="chrono_bloc">
<!-- Bloc texte -->
<div class="chrono_text">
<h2>#VALEUR{3}</h2>
<!-- colonne traité (surement col 2) -->
<p>Nom complet du traité : #VALEUR{2}</p>
<p>Adoption : #VALEUR{0}</p>
<p>Entrée en vigueur : #VALEUR{1}</p>
<div class="chrono_content">
<h3>Historique</h3>
<p>#VALEUR{4}</p>
<h3>Position de la France</h3>
<p>#VALEUR{5}</p>
<h3>Actualité du traité</h3>
<p>#VALEUR{6}</p>
<h3>Ressources et références</h3>
<p>#VALEUR{7}</p>
</div>
</div>
<button class="unroll" type="button">+</button>
<div class="chrono_date_box">
<div class="chrono_date">#VALEUR{8}</div>
</div>
</div>
</BOUCLE_chrono>
</B_documents_joints>
</div>
SCRIPT dans le même fichier
<script>
// on click the current .unroll unroll the sibling .chrono_content and change the button' text
document.querySelectorAll('.unroll').forEach(item => {
item.addEventListener('click', event => {
item.previousElementSibling.classList.toggle('unrolled');
if (item.innerHTML == '+') {
item.innerHTML = '-';
} else {
item.innerHTML = '+';
}
})
})
</script>