studio-variable/index-main
4
0
Fork 0
Code Issues 16 Pull requests Projects Releases Packages Wiki Activity Actions

fix: revert srcset on beforeafter images

Browse source 
Le srcset sur image-before/image-after perturbait le clip CSS
(width: var(--position)) rendant l'effet before/after inopérant.
On revient aux img simples (src only) pour garantir le bon fonctionnement
du slider.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-02-27 14:45:43 +01:00
parent a1fda065a9
commit 94065f1ce6
2 changed files with 1 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

9
site/plugins/beforeafter/snippets/blocks/beforeafter.php
View file

@ -3,11 +3,6 @@
$imageBefore = $block->imageBefore()->toFile(); $imageBefore = $block->imageBefore()->toFile();
$imageAfter = $block->imageAfter()->toFile(); $imageAfter = $block->imageAfter()->toFile();
$caption = $block->caption()->value(); $caption = $block->caption()->value();
$imgSizes = $imgSizes ?? '(min-width: 768px) 50vw, 90vw';
$imgSrcset = $imgSrcset ?? 'body-half';
$kirbyThumbs = kirby()->option('thumbs.srcsets', []);
$srcsetAttr = isset($kirbyThumbs[$imgSrcset]) ? fn($f) => $f->srcset($imgSrcset) : fn($f) => $f->srcset();
?> ?>
<?php if ($imageBefore || $imageAfter): ?> <?php if ($imageBefore || $imageAfter): ?>
@ -16,16 +11,12 @@ $srcsetAttr = isset($kirbyThumbs[$imgSrcset]) ? fn($f) => $f->srcset($imgSrcset
<?php if ($imageBefore): ?> <?php if ($imageBefore): ?>
<img class="image-before slider-image" <img class="image-before slider-image"
src="<?= $imageBefore->url() ?>" src="<?= $imageBefore->url() ?>"
srcset="<?= $srcsetAttr($imageBefore) ?>"
sizes="<?= $imgSizes ?>"
alt="<?= $imageBefore->alt()->or('Image avant')->esc() ?>" /> alt="<?= $imageBefore->alt()->or('Image avant')->esc() ?>" />
<?php endif ?> <?php endif ?>
<?php if ($imageAfter): ?> <?php if ($imageAfter): ?>
<img class="image-after slider-image" <img class="image-after slider-image"
src="<?= $imageAfter->url() ?>" src="<?= $imageAfter->url() ?>"
srcset="<?= $srcsetAttr($imageAfter) ?>"
sizes="<?= $imgSizes ?>"
alt="<?= $imageAfter->alt()->or('Image après')->esc() ?>" /> alt="<?= $imageAfter->alt()->or('Image après')->esc() ?>" />
<?php endif ?> <?php endif ?>
</div> </div>

6
site/templates/investigation.php
View file

@ -221,11 +221,7 @@ $dateLocale = substr(is_array($locale) ? reset($locale) : $locale, 0, 5);
<?php elseif ($block->type() === 'beforeafter'): ?> <?php elseif ($block->type() === 'beforeafter'): ?>
<div class="media"> <div class="media">
<?php snippet('blocks/' . $block->type(), [ <?php snippet('blocks/' . $block->type(), ['block' => $block]) ?>
'block' => $block,
'imgSizes' => '100vw',
'imgSrcset' => 'body-full',
]) ?>
</div> </div>
<?php elseif ($block->type() === 'video'): ?> <?php elseif ($block->type() === 'video'): ?>