- Configure thumbs presets in config.php (quality 85%, WebP format) - Create picture snippet with srcset and WebP support - Add product-card and product-detail presets - Update templates to use optimized images - Implement native lazy loading for product cards - Add aspect-ratio CSS for layout stability Improvements over reference project: - Complete PHPDoc documentation - Native CSS aspect-ratio support - Optimized lazy loading strategy - Product-specific image presets 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
35 lines
1.5 KiB
PHP
35 lines
1.5 KiB
PHP
<?php snippet('header', ['title' => $site->title(), 'template' => 'store']) ?>
|
|
|
|
<main>
|
|
<p class="p__baseline-big">
|
|
<?= $page->baseline()->or('Bienvenue sur la boutique de soutien à Index') ?>
|
|
</p>
|
|
|
|
<section id="store__container">
|
|
<?php foreach($site->children()->listed() as $product): ?>
|
|
<article class="store__product">
|
|
<figure>
|
|
<?php if($image = $product->images()->first()): ?>
|
|
<?php snippet('picture', [
|
|
'file' => $image,
|
|
'alt' => $product->title()->html(),
|
|
'preset' => 'product-card',
|
|
'size' => 25,
|
|
'lazy' => true
|
|
]) ?>
|
|
<?php endif ?>
|
|
</figure>
|
|
<p class="line-1"><a href="<?= $product->url() ?>"><?= $product->title()->html() ?></a></p>
|
|
<p class="price"><?= $product->price() ?>€</p>
|
|
<a href="<?= $product->url() ?>" class="link-block" aria-hidden="true"></a>
|
|
</article>
|
|
<?php endforeach ?>
|
|
</section>
|
|
|
|
<p class="p__baseline-big">
|
|
<?= t('supportText', 'Pour nous soutenir, vous pouvez aussi') ?>
|
|
<a href="https://soutenir.index.ngo" class="link-don"><?= t('makeDonation', 'faire un don') ?></a>
|
|
</p>
|
|
</main>
|
|
|
|
<?php snippet('footer') ?>
|