EP/website-typo3
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: render courses teaser only if applicable

Browse Source
This commit is contained in:
Björn Fromme
2024-11-15 08:31:29 +01:00
parent 14ae6a319a
commit eddad77f48
6 changed files with 74 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/typo3conf/ext/ep_theme/Resources/Private/Templates/Travelinfo/Index.html
+44 -31
View File
@@ -114,37 +114,16 @@
<div class="container px-4 lg:px-24 flex flex-col space-y-16 pb-16">
<f:for each="{travelinfo.teasers}" as="teaser">
<div class="grid grid-cols-1 md:grid-cols-3 gap-x-8"
data-controller="autocollapse"
data-autocollapse-offset-value="64">
<div class="relative self-start" data-autocollapse-target="sizer">
<f:image image="{teaser.image}" width="640" alt="" class="block w-full h-auto" />
<div class="absolute top-0 left-0 inset-0 bg-ep-primary/25 flex items-center justify-center">
<div class="w-32 h-32 xl:w-48 xl:h-48 text-white">
<f:render section="Icon" arguments="{icon: teaser.icon}"/>
</div>
</div>
</div>
<div class="md:col-span-2 relative p-4 md:p-0 md:pb-4 border border-gray-300 md:border-none">
<div class="pb-8"
data-autocollapse-target="container"
data-rte-content>
<h2 class="headline--primary">
{teaser.title}
</h2>
{teaser.bodytext -> f:format.html()}
</div>
<div class="absolute left-0 bottom-0 w-full bg-gradient-to-b from-transparent via-white via-20% to-white pt-2 md:pt-0">
<button type="button"
data-autocollapse-target="button"
data-action="autocollapse#toggle"
class="hidden text-ep-primary w-12 h-12 ml-4 md:ml-0 group toggle-more">
<f:render section="Icon" arguments="{icon: 'toggle'}" />
</button>
<div class="bg-ep-primary w-full md:w-1/3 h-1"></div>
</div>
</div>
</div>
<f:if condition="{teaser.category} == 'course'">
<f:then>
<f:if condition="{date.coursesIncluded}">
<f:render section="Teaser" arguments="{_all}"/>
</f:if>
</f:then>
<f:else>
<f:render section="Teaser" arguments="{_all}"/>
</f:else>
</f:if>
</f:for>
</div>
<div id="goodtoknow" class="bg-ep-primary-bg">
@@ -199,6 +178,40 @@
</div>
</f:section>
<f:section name="Teaser">
<div class="grid grid-cols-1 md:grid-cols-3 gap-x-8"
data-controller="autocollapse"
data-autocollapse-offset-value="64">
<div class="relative self-start" data-autocollapse-target="sizer">
<f:image image="{teaser.image}" width="640" alt="" class="block w-full h-auto" />
<div class="absolute top-0 left-0 inset-0 bg-ep-primary/25 flex items-center justify-center">
<div class="w-32 h-32 xl:w-48 xl:h-48 text-white">
<f:render section="Icon" arguments="{icon: teaser.category}"/>
</div>
</div>
</div>
<div class="md:col-span-2 relative p-4 md:p-0 md:pb-4 border border-gray-300 md:border-none">
<div class="pb-8"
data-autocollapse-target="container"
data-rte-content>
<h2 class="headline--primary">
{teaser.title}
</h2>
{teaser.bodytext -> f:format.html()}
</div>
<div class="absolute left-0 bottom-0 w-full bg-gradient-to-b from-transparent via-white via-20% to-white pt-2 md:pt-0">
<button type="button"
data-autocollapse-target="button"
data-action="autocollapse#toggle"
class="hidden text-ep-primary w-12 h-12 ml-4 md:ml-0 group toggle-more">
<f:render section="Icon" arguments="{icon: 'toggle'}" />
</button>
<div class="bg-ep-primary w-full md:w-1/3 h-1"></div>
</div>
</div>
</div>
</f:section>
<f:section name="Link">
<f:link.typolink parameter="{item.link}" class="flex flex-col space-y-4 items-center justify-center px-4 py-4 lg:py-16 text-white {color}">
<div class="w-10 h-10 lg:w-24 lg:h-24">