frommeandClaude Opus 5.5
53faeccb70
Restored from a46918d unchanged.
Co-Authored-By: Claude Opus 5.5 <[email protected]>
88 lines
6.2 KiB
HTML
88 lines
6.2 KiB
HTML
<html data-namespace-typo3-fluid="true" lang="en"
|
|
xmlns="http://www.w3.org/1999/xhtml"
|
|
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
|
|
|
|
<div class="splide mb-8"
|
|
data-controller="slider"
|
|
data-slider-preset-value="header">
|
|
<div class="splide__track">
|
|
<ul class="splide__list">
|
|
<f:for each="{slides}" as="slide" iteration="iteration">
|
|
<li class="splide__slide">
|
|
<div class="herounit">
|
|
<f:alias map="{image: slide.image.0}">
|
|
<f:if condition="{image}">
|
|
<div class="herounit__image">
|
|
<picture class="w-full h-full">
|
|
<source srcset="{f:uri.image(image: image, width: '1370')}" media="(min-width: 768px)">
|
|
<source srcset="{f:uri.image(image: image, height: '640', cropVariant: 'mobile')}" media="(max-width: 767px)">
|
|
<img src="{f:uri.image(image: image, cropVariant: 'mobile', height: '640')}" class="w-full h-auto" alt="{image.alternative}">
|
|
</picture>
|
|
</div>
|
|
</f:if>
|
|
</f:alias>
|
|
<div class="absolute left-0 bottom-0 inset-x-0 px-4 py-8 w-full md:bottom-1/2 md:translate-y-1/2">
|
|
<div class="lg:container px-0">
|
|
<div class="p-4 bg-ep-primary-dark/80 sbw:bg-sbw-primary/80 snz:bg-snz-primary/80 suz:bg-suz-primary/80 uch:bg-uch-primary/80 ser:bg-ser-primary/80 mb-4 md:p-8 md:max-w-2xl">
|
|
<span class="block text-2xl md:text-4xl lg:text-5xl max-w-sm md:max-w-none font-black text-white uppercase mb-4 md:mb-8">
|
|
{slide.headline}
|
|
</span>
|
|
<f:if condition="{slide.subline}">
|
|
<span class="hidden lg:block md:text-lg text-white mb-4 md:mb-8">
|
|
{slide.subline}
|
|
</span>
|
|
</f:if>
|
|
<f:if condition="{slide.button}">
|
|
<f:link.typolink parameter="{slide.page_uid}"
|
|
additionalAttributes="{'tabindex': '-1'}"
|
|
class="button bg-badge-gradient hover:bg-none hover:bg-ep-pink text-white inline-block">
|
|
{slide.button}
|
|
</f:link.typolink>
|
|
</f:if>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<f:if condition="{slide.skipass} || {badge}">
|
|
<div class="herounit__badge-wrapper">
|
|
<f:if condition="{slide.skipass}">
|
|
<f:link.typolink parameter="{settings.skipassPageUid}"
|
|
additionalAttributes="{'tabindex': '-1'}">
|
|
<div class="herounit__badge herounit__badge--skipass">
|
|
<div class="uppercase text-4xl font-bold leading-7 mb-2">Ski-<br>Pass</div>
|
|
<div class="uppercase">inklusive</div>
|
|
</div>
|
|
</f:link.typolink>
|
|
</f:if>
|
|
<f:if condition="{badge}">
|
|
<f:alias map="{badgeData: badge.0.data}">
|
|
<f:link.typolink parameter="{badgeData.link}"
|
|
additionalAttributes="{'tabindex': '-1'}">
|
|
<div class="herounit__badge herounit__badge--custom">
|
|
<svg viewBox="0 0 200 200"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
preserveAspectRatio="xMinYMin meet"
|
|
class="w-full h-full">
|
|
<circle fill="currentColor" class="text-ep-primary-dark/50" cx="100" cy="100" r="100"/>
|
|
<circle fill="currentColor" class="text-ep-primary-dark" cx="100" cy="100" r="70"/>
|
|
</svg>
|
|
<div class="absolute top-0 left-0 inset-0 flex flex-col items-center justify-center p-8">
|
|
<span class="block text-center text-white bg-ep-primary-dark uppercase font-bold leading-none text-xl">{badgeData.title -> f:format.raw()}</span>
|
|
<f:if condition="{badgeData.subtitle}">
|
|
<span class="block text-center text-white bg-ep-primary-dark uppercase font-bold leading-none">{badgeData.subtitle -> f:format.raw()}</span>
|
|
</f:if>
|
|
</div>
|
|
</div>
|
|
</f:link.typolink>
|
|
</f:alias>
|
|
</f:if>
|
|
</div>
|
|
</f:if>
|
|
</div>
|
|
</li>
|
|
</f:for>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
</html>
|