frommeandClaude Opus 5.5
a46918de9d
Copied unchanged from public/typo3conf/ext/ of EP/website at 9593cc8631354f8a363d6609de8b7433f669a9a0 (Git-tracked files only). History stays in the old repository. Only composer.json files are added so the extensions install as path packages. Co-Authored-By: Claude Opus 5.5 <[email protected]>
65 lines
2.9 KiB
HTML
65 lines
2.9 KiB
HTML
<html data-namespace-typo3-fluid="true" lang="en"
|
|
xmlns="http://www.w3.org/1999/xhtml"
|
|
xmlns:ep="http://typo3.org/ns/EP/EpTheme/ViewHelpers"
|
|
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
|
|
|
|
<div class="relative mb-4"
|
|
data-controller="lightbox">
|
|
<div class="absolute top-0 right-0 mt-4 mr-4 flex space-x-2 text-white">
|
|
{ep:icon(icon: 'search', class: 'w-8 h-8 md:w-10 md:h-10')}
|
|
<span class="text-4xl">
|
|
{images -> f:count()}
|
|
</span>
|
|
</div>
|
|
<f:alias map="{image: images.0}">
|
|
<a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}"
|
|
title="{image.title}"
|
|
data-action="lightbox#open">
|
|
<f:image image="{image}"
|
|
loading="lazy"
|
|
class="block w-full h-auto"
|
|
width="770"
|
|
height="430c+100"
|
|
alt="{image.alternative}"/>
|
|
</a>
|
|
</f:alias>
|
|
<f:if condition="{thumbnails}">
|
|
<f:if condition="{images -> f:count()} > 1">
|
|
<div class="hidden md:grid md:grid-cols-5 md:gap-2 md:pt-4">
|
|
<f:for each="{images}" as="image" iteration="iteration">
|
|
<f:if condition="{iteration.cycle} <= 5">
|
|
<a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}"
|
|
data-action="lightbox#open"
|
|
data-lightbox-target="thumb"
|
|
data-lightbox-index="{iteration.cycle}"
|
|
data-lightbox-caption="{image.originalResource.description}"
|
|
title="{image.title}"
|
|
class="block">
|
|
<f:image image="{image}"
|
|
loading="lazy"
|
|
class="block w-full h-auto"
|
|
width="150"
|
|
height="85c+100"
|
|
alt="{image.alternative}"/>
|
|
</a>
|
|
</f:if>
|
|
</f:for>
|
|
</div>
|
|
</f:if>
|
|
</f:if>
|
|
<div class="hidden">
|
|
<f:for each="{images}" as="image" iteration="iteration">
|
|
<f:if condition="{thumbnails} == 0 || {iteration.cycle} > 5">
|
|
<a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}"
|
|
data-lightbox-target="thumb"
|
|
data-lightbox-index="{iteration.cycle}"
|
|
data-lightbox-caption="{image.originalResource.description}">
|
|
{iteration.index}
|
|
</a>
|
|
</f:if>
|
|
</f:for>
|
|
</div>
|
|
</div>
|
|
|
|
</html>
|