Files
thalim-theme/templates/search.twig
T
valentin_le_moignandClaude Opus 5 167950c627 Loader de scroll infini : styles réactivés, sans décalage de mise en page
Les règles `.scroll-spinner` et leurs keyframes étaient enfermées dans le
bloc `/* … */` legacy de `_category.scss` : Sass recopie ces commentaires
verbatim, les trois points n'avaient donc aucun style et restaient
invisibles pendant le chargement AJAX. Bloc sorti du commentaire (le
legacy reste en place), points allégés (5 px, gris) et marge haute
élargie.

Le modifieur `--reserve` réserve la place en permanence et n'anime que
l'opacité, au lieu de basculer `display` : plus de saut de mise en page
ni à l'apparition ni à la disparition. `infiniteScroll.js` bascule
désormais la classe `is-loading`.

Le `rootMargin` de l'observer passe à 700 px pour que la requête parte
plus tôt, et le loader de l'agenda est supprimé (markup + JS).

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WQLwtNFa1LNaN7QTAbYkZx
2026-09-10 01:16:20 +02:00

93 lines
5.1 KiB
Twig

{% extends "base.twig" %}
{% block content %}
<main class="category-archive">
<div class="container">
<div class="full-block">
<header class="category-header">
<div class="category-header-top">
<nav class="breadcrumb" aria-label="Fil d'Ariane">
<a href="{{ function('home_url', '/') }}">{{ current_language == 'en' ? 'Home' : 'Accueil' }}</a>
<span class="breadcrumb__separator">&rarr;</span>
<span class="breadcrumb__current">{{ current_language == 'en' ? 'Search the site' : 'Recherche sur le site' }}</span>
</nav>
</div>
<h1 class="category-header__title">{{ current_language == 'en' ? 'Search the site' : 'Recherche sur le site' }}</h1>
</header>
<div class="search-page-form">
<p class="search-panel__desc">{{ current_language == 'en' ? 'Search for an event, a lab member, a publication…' : 'Rechercher un événement, un membre du laboratoire, un ouvrage…' }}</p>
<form class="search-panel__form" role="search" method="get" action="{{ function('home_url', '/') }}">
<div class="search-panel__input-wrap">
<input type="search" name="s" class="search-panel__input"
value="{{ search_query }}"
placeholder="{{ current_language == 'en' ? 'Type your search…' : 'Écrire la recherche…' }}"
autocomplete="off">
<button type="submit" class="search-panel__icon-btn" aria-label="{{ current_language == 'en' ? 'Search' : 'Rechercher sur le site' }}"><i class="iconoir-search"></i></button>
</div>
<button type="submit" class="search-panel__submit">
{{ current_language == 'en' ? 'Search' : 'Rechercher sur le site' }}
</button>
</form>
</div>
{% if author_cards is not empty %}
<section class="author-results">
<h2 class="author-results__title">{{ current_language == 'en' ? 'Lab members' : 'Membres du laboratoire' }}</h2>
<div class="author-cards-grid">
{% for author in author_cards %}
{% include 'partials/author-card.twig' %}
{% endfor %}
</div>
</section>
{% endif %}
{% if taxonomy_cards is not empty %}
<section class="taxonomy-results">
<h2 class="taxonomy-results__title">{{ current_language == 'en' ? 'Axes & research programs' : 'Axes & programmes de recherche' }}</h2>
<ul class="taxonomy-results__list">
{% for term in taxonomy_cards %}
<li class="taxonomy-results__item">
<a href="{{ term.url }}" class="taxonomy-results__link">
<span class="taxonomy-results__name">{{ term.name }}</span>
<span class="taxonomy-results__meta">{{ term.taxonomy_label }}{% if term.count %} · {{ term.count }} {{ term.count > 1 ? (current_language == 'en' ? 'posts' : 'publications') : (current_language == 'en' ? 'post' : 'publication') }}{% endif %}</span>
</a>
</li>
{% endfor %}
</ul>
</section>
{% endif %}
{% include 'partials/category-filters.twig' %}
<section class="subcategory-section">
{% if posts is not empty %}
<div class="post-grid" id="post-grid">
{% for post in posts %}
{% include 'partials/post-card.twig' with { post: post, card: cards[post.ID], show_category: true } %}
{% endfor %}
</div>
<div id="scroll-sentinel"
data-search="{{ search_query }}"
data-exclude-cats="31"
data-filter-cat="{{ active_cat_id }}"
data-filter-autres="{{ filter_autres }}"
data-axe="{{ active_axe }}"
data-date-from="{{ active_date_from }}"
data-date-to="{{ active_date_to }}"></div>
<div id="scroll-spinner" class="scroll-spinner scroll-spinner--reserve">
<div class="scroll-spinner__dot"></div>
<div class="scroll-spinner__dot"></div>
<div class="scroll-spinner__dot"></div>
</div>
{% else %}
<p class="search-no-results">
{{ current_language == 'en' ? 'No results for' : 'Aucun résultat pour' }} « {{ search_query }} ».
</p>
{% endif %}
</section>
</div>
</div>
</main>
{% endblock %}