I have the problem that the images on the server are partly not cut correctly or not at all. Locally everything looks as I would like. Only live just not.
Does anyone have an idea what this is? (Live Preview: www.dorfstattstadt.de
Live
Local
home.php
<div class="grid md:grid-cols-3 gap-8 mt-8">
<?php foreach($pages->find('projekte')->children()->listed()->flip()->limit(3) as $project): ?>
<?php $image = $project->gallery()->first()->toFile()->resize(700, 360) ?>
<a href="<?= $project->url() ?>" class="group bg-primary-100 rounded hover:bg-primary-100 transition-bg duration-200 ease-linear">
<img data-src="<?= $image->url() ?>" class="js-lazy rounded-t group-hover:opacity-75 transition-all duration-200 ease-linear block overflow-hidden">
<div class="p-6">
<p class="font-handwritten uppercase tracking-wider text-primary-base text-2xl"><?= $project->category() ?></p>
<h3 class="font-black font-display"><?= $project->title() ?></h3>
<p class="mt-2"><?= $project->text()->blocks()->excerpt(140) ?></p>
<?php snippet('link', ['className' => 'mt-4', 'tag' => 'span', 'text' => 'Jetzt lesen']) ?>
</div>
</a>
<?php endforeach ?>
</div>