mirror of
https://codeberg.org/PostERG/xamxam.git
synced 2026-09-25 18:03:05 +02:00
Replace the eager <img> on the home page with an htmx placeholder <figure> that fetches a /cover-fragment endpoint when it scrolls into view (hx-trigger="revealed"), so heavy cover bytes load only on demand. Add spinner + settle-fade transition CSS, and load htmx.min.js on home.
48 lines
2.2 KiB
PHP
48 lines
2.2 KiB
PHP
<?php if ($year): ?>
|
||
<p class="filter-info" role="status">
|
||
Année : <?= htmlspecialchars($year) ?>
|
||
<a href="/" class="clear-filter"><span aria-hidden="true">✕</span> Réinitialiser</a>
|
||
</p>
|
||
<?php elseif ($isDefaultView): ?>
|
||
<p class="home-section-label" role="status">Publication récente</p>
|
||
<?php endif; ?>
|
||
|
||
<main class="home-main" id="main-content">
|
||
<h1 class="sr-only">Mémoires de l'ERG</h1>
|
||
<ul class="cards-container">
|
||
<?php foreach ($itemsToLoad as $item): ?>
|
||
<li class="card">
|
||
<a href="/tfe?id=<?= (int)$item["id"] ?>">
|
||
<?php
|
||
$thumb = $coverMap[$item['id']] ?? null;
|
||
?>
|
||
<?php if ($thumb): ?>
|
||
<figure
|
||
hx-get="/cover-fragment?path=<?= urlencode($thumb) ?>"
|
||
hx-trigger="intersect threshold:0.05 once"
|
||
hx-swap="innerHTML"
|
||
aria-busy="true">
|
||
<div class="card__media--placeholder" role="status">
|
||
<span class="card__cover-loading">…</span>
|
||
</div>
|
||
</figure>
|
||
<?php else: ?>
|
||
<div class="card__media--gradient"
|
||
aria-hidden="true">
|
||
<span class="card__gradient-author"><?= htmlspecialchars($item['authors'] ?? '') ?></span>
|
||
<span class="card__gradient-title"><?= htmlspecialchars($item['title']) ?></span>
|
||
</div>
|
||
<?php endif; ?>
|
||
<p><?= htmlspecialchars($item["authors"] ?? '') ?><?php if (!empty($item['authors']) && !empty($item['title'])): ?> – <?php endif; ?><?= htmlspecialchars($item["title"]) ?><?php if (!empty($item['year'])): ?><span class="sr-only">, <?= (int)$item['year'] ?></span><?php endif; ?></p>
|
||
</a>
|
||
</li>
|
||
<?php endforeach; ?>
|
||
|
||
<?php if (empty($itemsToLoad)): ?>
|
||
<li class="cards-empty">Aucun mémoire trouvé.</li>
|
||
<?php endif; ?>
|
||
</ul>
|
||
|
||
<?php include APP_ROOT . '/templates/partials/pagination.php'; ?>
|
||
</main>
|