feat: various a11y fixes

This commit is contained in:
Björn Fromme
2025-05-14 14:37:40 +02:00
parent d9e1c79714
commit 69204656ae
47 changed files with 230 additions and 217 deletions
@@ -38,7 +38,6 @@ plugin.tx_eptheme {
defaultDetailPageUid = {$plugin.tx_epproducts.settings.defaultDetailPageUid} defaultDetailPageUid = {$plugin.tx_epproducts.settings.defaultDetailPageUid}
coronaUpdatesPageUid = {$plugin.tx_eptheme.settings.coronaUpdatesPageUid} coronaUpdatesPageUid = {$plugin.tx_eptheme.settings.coronaUpdatesPageUid}
logoImage = {$plugin.tx_eptheme.settings.logoImage} logoImage = {$plugin.tx_eptheme.settings.logoImage}
defaultTitle < sitetitle
forceActiveTopnavUid = {$plugin.tx_eptheme.settings.forceActiveTopnavUid} forceActiveTopnavUid = {$plugin.tx_eptheme.settings.forceActiveTopnavUid}
eventDateDayFrom = {$plugin.tx_eptheme.settings.eventDateDayFrom} eventDateDayFrom = {$plugin.tx_eptheme.settings.eventDateDayFrom}
eventDateDayTo = {$plugin.tx_eptheme.settings.eventDateDayTo} eventDateDayTo = {$plugin.tx_eptheme.settings.eventDateDayTo}
@@ -25,7 +25,7 @@ h4,
} }
.subline { .subline {
@apply block text-xs md:text-sm font-normal leading-6 opacity-60; @apply block text-sm md:text-base font-normal leading-6;
} }
// Lists // Lists
@@ -3,14 +3,20 @@
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
<f:render partial="Mainnav" section="Main" arguments="{_all}"/> <f:render partial="Mainnav" section="Main" arguments="{_all}"/>
<f:render partial="HeaderSlider" arguments="{_all}"/> <header>
<f:if condition="{data.tx_eptheme_hide_searchbar} || {settings.hideSearchbar}"> <f:render partial="HeaderSlider" arguments="{_all}"/>
<f:else> </header>
<f:cObject typoscriptObjectPath="lib.searchBar"/> <main>
</f:else> <f:if condition="{data.tx_eptheme_hide_searchbar} || {settings.hideSearchbar}">
</f:if> <f:else>
<f:render section="Content"/> <f:cObject typoscriptObjectPath="lib.searchBar"/>
<f:render partial="Footer" arguments="{_all}"/> </f:else>
</f:if>
<f:render section="Content"/>
</main>
<footer>
<f:render partial="Footer" arguments="{_all}"/>
</footer>
<f:render partial="ContactBar" arguments="{_all}"/> <f:render partial="ContactBar" arguments="{_all}"/>
<f:render partial="Topnav" arguments="{_all}"/> <f:render partial="Topnav" arguments="{_all}"/>
<f:render partial="Mobilenav" section="Main" arguments="{_all}"/> <f:render partial="Mobilenav" section="Main" arguments="{_all}"/>
@@ -3,10 +3,16 @@
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
<f:render partial="Mainnav" section="Main" arguments="{_all}"/> <f:render partial="Mainnav" section="Main" arguments="{_all}"/>
<f:render partial="EventHero" arguments="{_all}"/> <header>
<f:render partial="EventDisturber" arguments="{headline: settings.eventDisturberHeadline, listItems: settings.eventDisturberListitems, buttonLabel: settings.eventDisturberButtonLabel, buttonLink: settings.eventDisturberButtonLink}"/> <f:render partial="EventHero" arguments="{_all}"/>
<f:render section="Content"/> <f:render partial="EventDisturber" arguments="{headline: settings.eventDisturberHeadline, listItems: settings.eventDisturberListitems, buttonLabel: settings.eventDisturberButtonLabel, buttonLink: settings.eventDisturberButtonLink}"/>
<f:render partial="Footer" arguments="{_all}"/> </header>
<main>
<f:render section="Content"/>
</main>
<footer>
<f:render partial="Footer" arguments="{_all}"/>
</footer>
<f:render partial="ContactBar" arguments="{_all}"/> <f:render partial="ContactBar" arguments="{_all}"/>
<f:render partial="Topnav" arguments="{_all}"/> <f:render partial="Topnav" arguments="{_all}"/>
<f:render partial="Mobilenav" section="Main" arguments="{_all}"/> <f:render partial="Mobilenav" section="Main" arguments="{_all}"/>
@@ -3,16 +3,22 @@
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
<f:render partial="Mainnav" section="Main" arguments="{_all}"/> <f:render partial="Mainnav" section="Main" arguments="{_all}"/>
<f:render partial="HeaderSliderSmall" arguments="{_all}"/> <header>
<f:if condition="{data.tx_eptheme_hide_searchbar} || {settings.hideSearchbar}"> <f:render partial="HeaderSliderSmall" arguments="{_all}"/>
<f:else> <f:if condition="{data.tx_eptheme_hide_searchbar} || {settings.hideSearchbar}">
<f:cObject typoscriptObjectPath="lib.searchBar"/> <f:else>
</f:else> <f:cObject typoscriptObjectPath="lib.searchBar"/>
</f:if> </f:else>
<f:cObject typoscriptObjectPath="lib.breadcrumb"/> </f:if>
<f:render section="Content"/> </header>
<f:render section="Teasers"/> <main>
<f:render partial="Footer" arguments="{_all}"/> <f:cObject typoscriptObjectPath="lib.breadcrumb"/>
<f:render section="Content"/>
<f:render section="Teasers"/>
</main>
<footer>
<f:render partial="Footer" arguments="{_all}"/>
</footer>
<f:render partial="ContactBar" arguments="{_all}"/> <f:render partial="ContactBar" arguments="{_all}"/>
<f:render partial="Topnav" arguments="{_all}"/> <f:render partial="Topnav" arguments="{_all}"/>
<f:render partial="Mobilenav" section="Main" arguments="{_all}"/> <f:render partial="Mobilenav" section="Main" arguments="{_all}"/>
@@ -3,24 +3,30 @@
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
<f:render partial="Mainnav" section="Main" arguments="{_all}"/> <f:render partial="Mainnav" section="Main" arguments="{_all}"/>
<f:render partial="HeaderSliderSmall" arguments="{_all}"/> <header>
<f:if condition="{data.tx_eptheme_hide_searchbar}"> <f:render partial="HeaderSliderSmall" arguments="{_all}"/>
<f:else> <f:if condition="{data.tx_eptheme_hide_searchbar}">
<f:cObject typoscriptObjectPath="lib.searchBar"/> <f:else>
</f:else> <f:cObject typoscriptObjectPath="lib.searchBar"/>
</f:if> </f:else>
<f:cObject typoscriptObjectPath="lib.breadcrumb"/> </f:if>
<f:render section="Header" optional="true"/> </header>
<div class="container grid grid-cols-3 gap-8"> <main>
<div class="col-span-3 lg:col-span-1 order-last lg:order-none"> <f:cObject typoscriptObjectPath="lib.breadcrumb"/>
<f:render section="Sidebar"/> <f:render section="Header" optional="true"/>
<div class="container grid grid-cols-3 gap-8">
<div class="col-span-3 lg:col-span-1 order-last lg:order-none">
<f:render section="Sidebar"/>
</div>
<div class="col-span-3 lg:col-span-2">
<f:render section="Content"/>
</div>
</div> </div>
<div class="col-span-3 lg:col-span-2"> <f:render section="Teasers"/>
<f:render section="Content"/> </main>
</div> <footer>
</div> <f:render partial="Footer" arguments="{_all}"/>
<f:render section="Teasers"/> </footer>
<f:render partial="Footer" arguments="{_all}"/>
<f:render partial="ContactBar" arguments="{_all}"/> <f:render partial="ContactBar" arguments="{_all}"/>
<f:render partial="Topnav" arguments="{_all}"/> <f:render partial="Topnav" arguments="{_all}"/>
<f:render partial="Mobilenav" section="Main" arguments="{_all}"/> <f:render partial="Mobilenav" section="Main" arguments="{_all}"/>
@@ -3,19 +3,25 @@
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
<f:render partial="Mainnav" section="Main" arguments="{_all}"/> <f:render partial="Mainnav" section="Main" arguments="{_all}"/>
<f:render partial="HeaderSliderSmall" arguments="{_all}"/> <header>
<f:cObject typoscriptObjectPath="lib.breadcrumb"/> <f:render partial="HeaderSliderSmall" arguments="{_all}"/>
<f:render section="Header" optional="true"/> </header>
<div class="container grid grid-cols-3 gap-8"> <main>
<div class="col-span-3 lg:col-span-1 order-last lg:order-none"> <f:cObject typoscriptObjectPath="lib.breadcrumb"/>
<f:render section="Sidebar"/> <f:render section="Header" optional="true"/>
<div class="container grid grid-cols-3 gap-8">
<div class="col-span-3 lg:col-span-1 order-last lg:order-none">
<f:render section="Sidebar"/>
</div>
<div class="col-span-3 lg:col-span-2">
<f:render section="Content"/>
</div>
</div> </div>
<div class="col-span-3 lg:col-span-2"> <f:render section="Teasers"/>
<f:render section="Content"/> </main>
</div> <footer>
</div> <f:render partial="Footer" arguments="{_all}"/>
<f:render section="Teasers"/> </footer>
<f:render partial="Footer" arguments="{_all}"/>
<f:render partial="ContactBar" arguments="{_all}"/> <f:render partial="ContactBar" arguments="{_all}"/>
<f:render partial="Topnav" arguments="{_all}"/> <f:render partial="Topnav" arguments="{_all}"/>
<f:render partial="Mobilenav" section="Main" arguments="{_all}"/> <f:render partial="Mobilenav" section="Main" arguments="{_all}"/>
@@ -3,24 +3,30 @@
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
<f:render partial="Mainnav" section="Main" arguments="{_all}"/> <f:render partial="Mainnav" section="Main" arguments="{_all}"/>
<f:render partial="HeaderSliderSmall" arguments="{_all}"/> <header>
<f:if condition="{data.tx_eptheme_hide_searchbar}"> <f:render partial="HeaderSliderSmall" arguments="{_all}"/>
<f:else> <f:if condition="{data.tx_eptheme_hide_searchbar}">
<f:cObject typoscriptObjectPath="lib.searchBar"/> <f:else>
</f:else> <f:cObject typoscriptObjectPath="lib.searchBar"/>
</f:if> </f:else>
<f:cObject typoscriptObjectPath="lib.breadcrumb"/> </f:if>
<f:render section="Header" optional="true"/> </header>
<div class="container grid grid-cols-3 gap-8"> <main>
<div class="col-span-3 lg:col-span-2"> <f:cObject typoscriptObjectPath="lib.breadcrumb"/>
<f:render section="Content"/> <f:render section="Header" optional="true"/>
<div class="container grid grid-cols-3 gap-8">
<div class="col-span-3 lg:col-span-2">
<f:render section="Content"/>
</div>
<div class="col-span-3 lg:col-span-1">
<f:render section="Sidebar"/>
</div>
</div> </div>
<div class="col-span-3 lg:col-span-1"> <f:render section="Teasers"/>
<f:render section="Sidebar"/> </main>
</div> <footer>
</div> <f:render partial="Footer" arguments="{_all}"/>
<f:render section="Teasers"/> </footer>
<f:render partial="Footer" arguments="{_all}"/>
<f:render partial="ContactBar" arguments="{_all}"/> <f:render partial="ContactBar" arguments="{_all}"/>
<f:render partial="Topnav" arguments="{_all}"/> <f:render partial="Topnav" arguments="{_all}"/>
<f:render partial="Mobilenav" section="Main" arguments="{_all}"/> <f:render partial="Mobilenav" section="Main" arguments="{_all}"/>
@@ -3,19 +3,25 @@
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
<f:render partial="Mainnav" section="Main" arguments="{_all}"/> <f:render partial="Mainnav" section="Main" arguments="{_all}"/>
<f:render partial="HeaderSliderSmall" arguments="{_all}"/> <header>
<f:cObject typoscriptObjectPath="lib.breadcrumb"/> <f:render partial="HeaderSliderSmall" arguments="{_all}"/>
<f:render section="Header" optional="true"/> <f:cObject typoscriptObjectPath="lib.breadcrumb"/>
<div class="container grid grid-cols-3 gap-8"> </header>
<div class="col-span-3 lg:col-span-2"> <main>
<f:render section="Content"/> <f:render section="Header" optional="true"/>
<div class="container grid grid-cols-3 gap-8">
<div class="col-span-3 lg:col-span-2">
<f:render section="Content"/>
</div>
<div class="col-span-3 lg:col-span-1">
<f:render section="Sidebar"/>
</div>
</div> </div>
<div class="col-span-3 lg:col-span-1"> <f:render section="Teasers"/>
<f:render section="Sidebar"/> </main>
</div> <footer>
</div> <f:render partial="Footer" arguments="{_all}"/>
<f:render section="Teasers"/> </footer>
<f:render partial="Footer" arguments="{_all}"/>
<f:render partial="ContactBar" arguments="{_all}"/> <f:render partial="ContactBar" arguments="{_all}"/>
<f:render partial="Topnav" arguments="{_all}"/> <f:render partial="Topnav" arguments="{_all}"/>
<f:render partial="Mobilenav" section="Main" arguments="{_all}"/> <f:render partial="Mobilenav" section="Main" arguments="{_all}"/>
@@ -3,13 +3,13 @@
xmlns:ep="http://typo3.org/ns/EP/EpTheme/ViewHelpers" xmlns:ep="http://typo3.org/ns/EP/EpTheme/ViewHelpers"
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
<div class="container bg-white flex items-center justify-between"> <header class="container bg-white flex items-center justify-between">
<f:link.typolink parameter="{f:if(condition: settings.logoLink, then: settings.logoLink, else: settings.defaultHomeUid)}" <f:link.typolink parameter="{f:if(condition: settings.logoLink, then: settings.logoLink, else: settings.defaultHomeUid)}"
class="block lg:pb-4" class="block lg:pb-4"
title="{settings.defaultTitle}"> title="zur Startseite">
<f:image src="{settings.logoImage}" <f:image src="Logo"
class="block w-auto {ep:themeClasses(classes: '{ep: \'h-10 lg:h-12\', sbw: \'h-14 lg:h-24\', snz: \'h-14 lg:h-24\', suz: \'h-14 lg:h-24\', uch: \'h-12 lg:h-20\', ser: \'h-10 lg:h-12\'}', key: settings.themekey)}" class="block w-auto {ep:themeClasses(classes: '{ep: \'h-10 lg:h-12\', sbw: \'h-14 lg:h-24\', snz: \'h-14 lg:h-24\', suz: \'h-14 lg:h-24\', uch: \'h-12 lg:h-20\', ser: \'h-10 lg:h-12\'}', key: settings.themekey)}"
alt="{settings.defaultTitle}"/> alt="Logo"/>
</f:link.typolink> </f:link.typolink>
<f:link.typolink parameter="{settings.myEpPageUid}" <f:link.typolink parameter="{settings.myEpPageUid}"
title="My E&P" title="My E&P"
@@ -17,8 +17,12 @@
<div class="text-xl lg:text-2xl font-light leading-none">Login</div> <div class="text-xl lg:text-2xl font-light leading-none">Login</div>
<div class="text-lg lg:text-xl font-medium leading-none">My E&P</div> <div class="text-lg lg:text-xl font-medium leading-none">My E&P</div>
</f:link.typolink> </f:link.typolink>
</div> </header>
<f:render section="Content"/> <main>
<f:render partial="Footer" arguments="{_all}"/> <f:render section="Content"/>
</main>
<footer>
<f:render partial="Footer" arguments="{_all}"/>
</footer>
<f:render partial="Config" arguments="{_all}" /> <f:render partial="Config" arguments="{_all}" />
</html> </html>
@@ -4,7 +4,7 @@
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
<f:section name="Teaser"> <f:section name="Teaser">
<a href="{f:uri.typolink(parameter: city.detailPage)}" class="flex flex-col" title="{city.name}"> <a href="{f:uri.typolink(parameter: city.detailPage)}" class="flex flex-col">
<div class="relative"> <div class="relative">
{ep:icon(icon: 'flag-{city.country.code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6 absolute top-0 left-0')} {ep:icon(icon: 'flag-{city.country.code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6 absolute top-0 left-0')}
<f:alias map="{teaserImage: city.teaserImage, defaultImage: city.images.0}"> <f:alias map="{teaserImage: city.teaserImage, defaultImage: city.images.0}">
@@ -5,7 +5,7 @@
<f:section name="Teaser"> <f:section name="Teaser">
<f:if condition="{concept}"> <f:if condition="{concept}">
<a href="{f:uri.typolink(parameter: concept.detailPage)}" title="{concept.name}" class="flex flex-col"> <a href="{f:uri.typolink(parameter: concept.detailPage)}" class="flex flex-col">
<div class="relative"> <div class="relative">
<f:alias map="{teaserImage: concept.teaserImage, defaultImage: concept.headerImage}"> <f:alias map="{teaserImage: concept.teaserImage, defaultImage: concept.headerImage}">
<f:if condition="{teaserImage}"> <f:if condition="{teaserImage}">
@@ -6,7 +6,6 @@
<div class="contact-bar"> <div class="contact-bar">
<a href="{f:uri.typolink(parameter: settings.watchlistPageUid)}" <a href="{f:uri.typolink(parameter: settings.watchlistPageUid)}"
class="contact-bar__item" class="contact-bar__item"
title="Merkliste"
data-controller="watchlist-label" data-controller="watchlist-label"
data-action="watchlist-toggle:toggle@window->watchlist-label#update" data-action="watchlist-toggle:toggle@window->watchlist-label#update"
rel="nofollow"> rel="nofollow">
@@ -17,7 +16,6 @@
</a> </a>
<a href="tel:{settings.phoneNumberLink}" <a href="tel:{settings.phoneNumberLink}"
class="contact-bar__item" class="contact-bar__item"
title="Telefonische Beratung"
rel="nofollow"> rel="nofollow">
{ep:icon(icon: 'phone', class: 'contact-bar__icon')} {ep:icon(icon: 'phone', class: 'contact-bar__icon')}
<div class="hidden md:block"> <div class="hidden md:block">
@@ -25,8 +23,7 @@
</div> </div>
</a> </a>
<f:link.email email="{settings.contactFormToEmail}" <f:link.email email="{settings.contactFormToEmail}"
class="contact-bar__item" class="contact-bar__item">
title="E-Mail">
{ep:icon(icon: 'email', class: 'contact-bar__icon')} {ep:icon(icon: 'email', class: 'contact-bar__icon')}
<div class="contact-bar__label"> <div class="contact-bar__label">
{settings.contactFormToEmail} {settings.contactFormToEmail}
@@ -35,7 +32,6 @@
<f:if condition="{settings.whatsApp}"> <f:if condition="{settings.whatsApp}">
<a href="{settings.whatsAppNumberLink}" <a href="{settings.whatsAppNumberLink}"
class="contact-bar__item" class="contact-bar__item"
title="Whatsapp"
target="_blank" target="_blank"
rel="nofollow"> rel="nofollow">
{ep:icon(icon: 'whatsapp', class: 'contact-bar__icon')} {ep:icon(icon: 'whatsapp', class: 'contact-bar__icon')}
@@ -83,7 +79,7 @@
</a> </a>
</f:if> </f:if>
<f:if condition="{settings.englishPageUid}"> <f:if condition="{settings.englishPageUid}">
<f:link.typolink parameter="{settings.englishPageUid}" title="English" class="contact-bar__item"> <f:link.typolink parameter="{settings.englishPageUid}" class="contact-bar__item">
{ep:icon(icon: 'flag-gb', class: 'contact-bar__icon')} {ep:icon(icon: 'flag-gb', class: 'contact-bar__icon')}
<div class="contact-bar__label"> <div class="contact-bar__label">
English English
@@ -91,7 +87,7 @@
</f:link.typolink> </f:link.typolink>
</f:if> </f:if>
<f:if condition="{settings.germanPageUid}"> <f:if condition="{settings.germanPageUid}">
<f:link.typolink parameter="{settings.germanPageUid}" title="English" class="contact-bar__item"> <f:link.typolink parameter="{settings.germanPageUid}" class="contact-bar__item">
{ep:icon(icon: 'flag-de', class: 'contact-bar__icon')} {ep:icon(icon: 'flag-de', class: 'contact-bar__icon')}
<div class="contact-bar__label"> <div class="contact-bar__label">
Deutsch Deutsch
@@ -18,8 +18,7 @@
class="block w-full h-auto rounded-full" class="block w-full h-auto rounded-full"
width="400" width="400"
height="400c" height="400c"
alt="{image.alternative}" alt="{image.alternative}" />
title="{image.title}" />
</f:if> </f:if>
<a href="tel:{settings.phoneNumber -> v:format.pregReplace(pattern: '/[\-\s]/', replacement: '')}" <a href="tel:{settings.phoneNumber -> v:format.pregReplace(pattern: '/[\-\s]/', replacement: '')}"
rel="nofollow" rel="nofollow"
@@ -12,7 +12,9 @@
<div>{data.text -> f:format.html()}</div> <div>{data.text -> f:format.html()}</div>
<div> <div>
{data.flexForm.buttons -> v:iterator.first() -> v:variable.set(name: 'button')} {data.flexForm.buttons -> v:iterator.first() -> v:variable.set(name: 'button')}
<a href="{f:uri.typolink(parameter: button.container.link)}" class="btn btn-info" title="{button.container.label -> f:format.raw()}">{button.container.label -> f:format.raw()}</a> <a href="{f:uri.typolink(parameter: button.container.link)}" class="btn btn-info">
{button.container.label -> f:format.raw()}
</a>
</div> </div>
</div> </div>
<f:render partial="Disrupter/Outlines" <f:render partial="Disrupter/Outlines"
@@ -13,16 +13,16 @@
loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png" loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
class="block w-full h-auto rounded-full" class="block w-full h-auto rounded-full"
width="400" width="400"
alt="{image.alternative}" alt="{image.alternative}" />
title="{image.title}" />
</f:if> </f:if>
</a> </a>
</div> </div>
<div class="col-md-6 "> <div class="col-md-6 ">
<div>{data.text -> f:format.html()}</div> <div>{data.text -> f:format.html()}</div>
</div> </div>
<a href="{f:uri.typolink(parameter: button.container.link)}" class="btn btn-info" <a href="{f:uri.typolink(parameter: button.container.link)}" class="btn btn-info">
title="{button.container.label -> f:format.raw()}">{button.container.label -> f:format.raw()}</a> {button.container.label -> f:format.raw()}
</a>
</div> </div>
</f:alias> </f:alias>
@@ -16,8 +16,7 @@
class="block w-full h-auto rounded-full" class="block w-full h-auto rounded-full"
width="400" width="400"
height="400c" height="400c"
alt="{image.alternative}" alt="{image.alternative}" />
title="{image.title}" />
</f:if> </f:if>
</div> </div>
<div class="px-16 md:px-4 md:w-5/6 md:pl-8 text-center text-white md:text-left" data-rte-content> <div class="px-16 md:px-4 md:w-5/6 md:pl-8 text-center text-white md:text-left" data-rte-content>
@@ -19,8 +19,7 @@
class="block w-full h-auto rounded-full" class="block w-full h-auto rounded-full"
width="400" width="400"
height="400c" height="400c"
alt="{teaserImage.alternative}" alt="{teaserImage.alternative}" />
title="{teaserImage.title}" />
</f:if> </f:if>
<a href="tel:{settings.phoneNumber -> v:format.pregReplace(pattern: '/[\-\s]/', replacement: '')}" <a href="tel:{settings.phoneNumber -> v:format.pregReplace(pattern: '/[\-\s]/', replacement: '')}"
rel="nofollow" rel="nofollow"
@@ -13,16 +13,16 @@
loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png" loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
class="block w-full h-auto rounded-full" class="block w-full h-auto rounded-full"
width="400" width="400"
alt="{teaserImage.alternative}" alt="{teaserImage.alternative}" />
title="{teaserImage.title}" />
</f:if> </f:if>
</a> </a>
</div> </div>
<div class="col-md-6 "> <div class="col-md-6 ">
<div>{data.bodytext -> f:format.html()}</div> <div>{data.bodytext -> f:format.html()}</div>
</div> </div>
<a href="{f:uri.typolink(parameter: button.container.link)}" class="btn btn-info" <a href="{f:uri.typolink(parameter: button.container.link)}" class="btn btn-info">
title="{button.container.label -> f:format.raw()}">{button.container.label -> f:format.raw()}</a> {button.container.label -> f:format.raw()}
</a>
</div> </div>
</f:alias> </f:alias>
@@ -16,8 +16,7 @@
class="block w-full h-auto rounded-full" class="block w-full h-auto rounded-full"
width="400" width="400"
height="400c" height="400c"
alt="{teaserImage.alternative}" alt="{teaserImage.alternative}" />
title="{teaserImage.title}" />
</f:if> </f:if>
</div> </div>
<div class="px-16 md:px-4 md:w-5/6 md:pl-8 text-center text-white md:text-left" data-rte-content> <div class="px-16 md:px-4 md:w-5/6 md:pl-8 text-center text-white md:text-left" data-rte-content>
@@ -22,8 +22,7 @@
</div> </div>
<div class="w-full lg:w-1/3 lg:px-4"> <div class="w-full lg:w-1/3 lg:px-4">
<a class="button bg-button w-full" <a class="button bg-button w-full"
href="{f:uri.typolink(parameter: buttonLink)}" href="{f:uri.typolink(parameter: buttonLink)}">
title="{buttonLabel -> f:format.raw()}">
{buttonLabel -> f:format.raw()} {buttonLabel -> f:format.raw()}
</a> </a>
</div> </div>
@@ -14,6 +14,7 @@
<f:if condition="{filter}"> <f:if condition="{filter}">
<div class="mb-4 pr-2 w-80 border-b border-r border-white flex items-center justify-between"> <div class="mb-4 pr-2 w-80 border-b border-r border-white flex items-center justify-between">
<input type="text" <input type="text"
aria-label="Suchbegriff"
data-action="faq#filter" data-action="faq#filter"
class="bg-transparent border-0 uppercase ring-0 focus:ring-0 placeholder-white text-white" class="bg-transparent border-0 uppercase ring-0 focus:ring-0 placeholder-white text-white"
placeholder="Suchbegriff"> placeholder="Suchbegriff">
@@ -44,8 +45,8 @@
<f:if condition="{settings.infoPageUid}"> <f:if condition="{settings.infoPageUid}">
<div class="flex items-center justify-end space-x-2 text-sm text-white"> <div class="flex items-center justify-end space-x-2 text-sm text-white">
{ep:icon(icon: 'info-circle', class: 'w-4 h-4')} {ep:icon(icon: 'info-circle', class: 'w-4 h-4')}
<a href="{f:uri.typolink(parameter: settings.infoPageUid)}"> <a href="{f:uri.typolink(parameter: settings.infoPageUid)}" class="underline">
Weitere Reiseinfos findet ihr <span class="underline">hier</span> Weitere Reiseinfos findet ihr hier
</a> </a>
</div> </div>
</f:if> </f:if>
@@ -20,7 +20,6 @@
<f:for each="{menuheader.children}" as="submenuitem"> <f:for each="{menuheader.children}" as="submenuitem">
<li> <li>
<f:link.typolink parameter="{submenuitem.link}" <f:link.typolink parameter="{submenuitem.link}"
title="{submenuitem.linktext}"
class="inline-block py-2 text-lg leading-none text-white"> class="inline-block py-2 text-lg leading-none text-white">
{submenuitem.title} {submenuitem.title}
</f:link.typolink> </f:link.typolink>
@@ -48,7 +47,6 @@
</span> </span>
<a class="text-white whitespace-nowrap" <a class="text-white whitespace-nowrap"
href="tel:{settings.phoneNumberLink}" href="tel:{settings.phoneNumberLink}"
title="Service Telefon anrufen"
rel="nofollow"> rel="nofollow">
{settings.phoneNumber} {settings.phoneNumber}
</a> </a>
@@ -73,7 +71,6 @@
</span> </span>
<a class="text-white whitespace-nowrap" <a class="text-white whitespace-nowrap"
href="{settings.whatsAppNumberLink}" href="{settings.whatsAppNumberLink}"
title="WhatsApp"
target="_blank" target="_blank"
rel="nofollow"> rel="nofollow">
{settings.whatsApp} {settings.whatsApp}
@@ -100,22 +97,19 @@
<ul class="p-0 m-0"> <ul class="p-0 m-0">
<li> <li>
<f:link.typolink parameter="{settings.legalNoticePageUid}" <f:link.typolink parameter="{settings.legalNoticePageUid}"
class="text-white" class="text-white">
title="Impressum">
Impressum Impressum
</f:link.typolink> </f:link.typolink>
</li> </li>
<li> <li>
<f:link.typolink parameter="{settings.termsAndConditionsPageUid}" <f:link.typolink parameter="{settings.termsAndConditionsPageUid}"
class="text-white" class="text-white">
title="AGB">
AGB AGB
</f:link.typolink> </f:link.typolink>
</li> </li>
<li> <li>
<f:link.typolink parameter="{settings.dataProtectionPageUid}" <f:link.typolink parameter="{settings.dataProtectionPageUid}"
class="text-white" class="text-white">
title="Datenschutz">
Datenschutz Datenschutz
</f:link.typolink> </f:link.typolink>
</li> </li>
@@ -160,8 +154,7 @@
<ep:lazyLoadImage src="EXT:ep_theme/Resources/Public/images/pow_de.png" <ep:lazyLoadImage src="EXT:ep_theme/Resources/Public/images/pow_de.png"
loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png" loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
class="block w-full h-auto" class="block w-full h-auto"
alt="Protect our Winters" alt="Protect our Winters" />
title="Protect our Winters" />
</a> </a>
<a class="block bg-white p-2 w-24 md:w-16 xl:w-24 rounded" <a class="block bg-white p-2 w-24 md:w-16 xl:w-24 rounded"
href="https://www.unglobalcompact.org/" href="https://www.unglobalcompact.org/"
@@ -172,8 +165,7 @@
loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png" loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
class="block w-full h-auto" class="block w-full h-auto"
width="100" width="100"
alt="Global Compact" alt="Global Compact" />
title="Global Compact" />
</a> </a>
</div> </div>
</div> </div>
@@ -44,17 +44,16 @@
<f:if condition="{slide.skipass} || {badge}"> <f:if condition="{slide.skipass} || {badge}">
<div class="herounit__badge-wrapper"> <div class="herounit__badge-wrapper">
<f:if condition="{slide.skipass}"> <f:if condition="{slide.skipass}">
<f:link.typolink parameter="{settings.skipassPageUid}" title="Skipass inklusive"> <f:link.typolink parameter="{settings.skipassPageUid}">
<div class="herounit__badge herounit__badge--skipass"> <div class="herounit__badge herounit__badge--skipass">
<p class="uppercase text-4xl font-bold leading-7 mb-2">Ski-<br>Pass</p> <div class="uppercase text-4xl font-bold leading-7 mb-2">Ski-<br>Pass</div>
<p class="uppercase">inklusive</p> <div class="uppercase">inklusive</div>
</div> </div>
</f:link.typolink> </f:link.typolink>
</f:if> </f:if>
<f:if condition="{badge}"> <f:if condition="{badge}">
<f:alias map="{badgeData: badge.0.data}"> <f:alias map="{badgeData: badge.0.data}">
<f:link.typolink parameter="{badgeData.link}" <f:link.typolink parameter="{badgeData.link}">
title="{badgeData.title}">
<div class="herounit__badge herounit__badge--custom"> <div class="herounit__badge herounit__badge--custom">
<svg viewBox="0 0 200 200" <svg viewBox="0 0 200 200"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
@@ -38,7 +38,7 @@
<f:if condition="{slide.skipass} || {badge}"> <f:if condition="{slide.skipass} || {badge}">
<div class="herounit__badge-wrapper"> <div class="herounit__badge-wrapper">
<f:if condition="{settings.showSkipassBadge}"> <f:if condition="{settings.showSkipassBadge}">
<f:link.typolink parameter="{settings.skipassPageUid}" title="Skipass inklusive"> <f:link.typolink parameter="{settings.skipassPageUid}">
<div class="herounit__badge herounit__badge--skipass"> <div class="herounit__badge herounit__badge--skipass">
<p class="uppercase text-4xl font-bold leading-7 mb-2">Ski-<br>Pass</p> <p class="uppercase text-4xl font-bold leading-7 mb-2">Ski-<br>Pass</p>
<p class="uppercase">inklusive</p> <p class="uppercase">inklusive</p>
@@ -47,8 +47,7 @@
</f:if> </f:if>
<f:if condition="{badge}"> <f:if condition="{badge}">
<f:alias map="{badgeData: badge.0.data}"> <f:alias map="{badgeData: badge.0.data}">
<f:link.typolink parameter="{badgeData.link}" <f:link.typolink parameter="{badgeData.link}">
title="{badgeData.title}">
<div class="hidden md:block absolute top-0 right-0 mt-12 mr-8 w-40 rotate-6"> <div class="hidden md:block absolute top-0 right-0 mt-12 mr-8 w-40 rotate-6">
<svg viewBox="0 0 200 200" <svg viewBox="0 0 200 200"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
@@ -4,7 +4,7 @@
xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">
<f:section name="Teaser"> <f:section name="Teaser">
<a href="{f:uri.typolink(parameter: hotel.detailPage)}" title="{hotel.name}" class="flex flex-col"> <a href="{f:uri.typolink(parameter: hotel.detailPage)}" class="flex flex-col">
<div class="relative"> <div class="relative">
{ep:icon(icon: 'flag-{hotel.country.code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6 absolute top-0 left-0')} {ep:icon(icon: 'flag-{hotel.country.code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6 absolute top-0 left-0')}
<f:if condition="{hotel.images.original.0}"> <f:if condition="{hotel.images.original.0}">
@@ -13,14 +13,14 @@
</div> </div>
<f:alias map="{image: images.0}"> <f:alias map="{image: images.0}">
<a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}" <a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}"
title="{image.title}"
data-action="lightbox#open"> data-action="lightbox#open">
<ep:lazyLoadImage image="{image}" <ep:lazyLoadImage image="{image}"
loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png" loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
class="block w-full h-auto" class="block w-full h-auto"
width="770" width="770"
height="430c+100" height="430c+100"
alt="{image.alternative}" alt="{image.alternative}"/>
title="{image.title}" />
</a> </a>
</f:alias> </f:alias>
<f:if condition="{thumbnails}"> <f:if condition="{thumbnails}">
@@ -33,14 +33,14 @@
data-lightbox-target="thumb" data-lightbox-target="thumb"
data-lightbox-index="{iteration.cycle}" data-lightbox-index="{iteration.cycle}"
data-lightbox-caption="{image.originalResource.description}" data-lightbox-caption="{image.originalResource.description}"
title="{image.title}"
class="block"> class="block">
<ep:lazyLoadImage image="{image}" <ep:lazyLoadImage image="{image}"
loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png" loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
class="block w-full h-auto" class="block w-full h-auto"
width="150" width="150"
height="85c+100" height="85c+100"
alt="{image.alternative}" alt="{image.alternative}"/>
title="{image.title}" />
</a> </a>
</f:if> </f:if>
</f:for> </f:for>
@@ -53,8 +53,9 @@
<a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}" <a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}"
data-lightbox-target="thumb" data-lightbox-target="thumb"
data-lightbox-index="{iteration.cycle}" data-lightbox-index="{iteration.cycle}"
data-lightbox-caption="{image.originalResource.description}" data-lightbox-caption="{image.originalResource.description}">
title="{image.originalResource.title}">{iteration.index}</a> {iteration.index}
</a>
</f:if> </f:if>
</f:for> </f:for>
</div> </div>
@@ -14,8 +14,7 @@
class="block w-full h-auto" class="block w-full h-auto"
width="770" width="770"
height="430c+100" height="430c+100"
alt="{journey.image.alternative}" alt="{journey.image.alternative}" />
title="{journey.image.title}" />
</f:if> </f:if>
<f:if condition="{journey.byBus}"> <f:if condition="{journey.byBus}">
<h3> <h3>
@@ -8,10 +8,10 @@
<div class="flex items-center hover-hover:lg:items-end justify-between px-4 py-2 lg:px-0 lg:pt-4 lg:pb-0"> <div class="flex items-center hover-hover:lg:items-end justify-between px-4 py-2 lg:px-0 lg:pt-4 lg:pb-0">
<f:link.typolink parameter="{f:if(condition: settings.logoLink, then: settings.logoLink, else: settings.defaultHomeUid)}" <f:link.typolink parameter="{f:if(condition: settings.logoLink, then: settings.logoLink, else: settings.defaultHomeUid)}"
class="block lg:pb-4" class="block lg:pb-4"
title="{settings.defaultTitle}"> title="zur Startseite">
<f:image src="{settings.logoImage}" <f:image src="{settings.logoImage}"
class="block w-auto {ep:themeClasses(classes: '{ep: \'h-10 lg:h-12\', sbw: \'h-14 lg:h-24\', snz: \'h-14 lg:h-24\', suz: \'h-14 lg:h-24\', uch: \'h-12 lg:h-20\', ser: \'h-10 lg:h-12\'}', key: settings.themekey)}" class="block w-auto {ep:themeClasses(classes: '{ep: \'h-10 lg:h-12\', sbw: \'h-14 lg:h-24\', snz: \'h-14 lg:h-24\', suz: \'h-14 lg:h-24\', uch: \'h-12 lg:h-20\', ser: \'h-10 lg:h-12\'}', key: settings.themekey)}"
alt="{settings.defaultTitle}"/> alt="Logo"/>
</f:link.typolink> </f:link.typolink>
<div class="hidden hover-hover:lg:block"> <div class="hidden hover-hover:lg:block">
<f:render section="FirstLevel" arguments="{_all}"/> <f:render section="FirstLevel" arguments="{_all}"/>
@@ -50,8 +50,8 @@
<f:if condition="{topitem.children}"> <f:if condition="{topitem.children}">
<f:then> <f:then>
<a href="{f:uri.typolink(parameter: topitem.data.uid)}" <a href="{f:uri.typolink(parameter: topitem.data.uid)}"
class="text-zinc-800 uppercase lg:text-lg font-bold flex items-center" role="menuitem"
title="{topitem.title}"> class="text-zinc-800 uppercase lg:text-lg font-bold flex items-center">
<span>{topitem.title}</span> <span>{topitem.title}</span>
{ep:icon(icon: 'chevron-down', class: 'ml-1 w-4 h-4 group-hover:rotate-180')} {ep:icon(icon: 'chevron-down', class: 'ml-1 w-4 h-4 group-hover:rotate-180')}
</a> </a>
@@ -59,8 +59,8 @@
</f:then> </f:then>
<f:else> <f:else>
<a href="{topitem.link}"{f:if(condition: '{topitem.doktype} == 3', then: ' target="_blank"')} <a href="{topitem.link}"{f:if(condition: '{topitem.doktype} == 3', then: ' target="_blank"')}
class="block text-zinc-800 uppercase lg:text-lg font-bold" role="menuitem"
title="{topitem.title}"> class="block text-zinc-800 uppercase lg:text-lg font-bold">
{topitem.title} {topitem.title}
</a> </a>
</f:else> </f:else>
@@ -80,7 +80,7 @@
</button> </button>
</f:then> </f:then>
<f:else> <f:else>
<f:link.typolink parameter="{settings.defaultSearchPageUid}"> <f:link.typolink parameter="{settings.defaultSearchPageUid}" title="zur Suche">
{ep:icon(icon: 'search', class: 'w-6 h-6')} {ep:icon(icon: 'search', class: 'w-6 h-6')}
</f:link.typolink> </f:link.typolink>
</f:else> </f:else>
@@ -100,7 +100,7 @@
<li> <li>
<f:if condition="{subitem.doktype} == 3"> <f:if condition="{subitem.doktype} == 3">
<f:then> <f:then>
<a href="{subitem.link}" target="_blank" title="{subitem.title}"> <a href="{subitem.link}" target="_blank">
<f:if condition="{subitem.data.tx_eptheme_context_country_code}"> <f:if condition="{subitem.data.tx_eptheme_context_country_code}">
{ep:icon(icon: 'flag-{subitem.data.tx_eptheme_context_country_code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6')} {ep:icon(icon: 'flag-{subitem.data.tx_eptheme_context_country_code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6')}
</f:if> </f:if>
@@ -111,8 +111,7 @@
</f:then> </f:then>
<f:else> <f:else>
<a href="{f:uri.typolink(parameter: subitem.data.uid)}" <a href="{f:uri.typolink(parameter: subitem.data.uid)}"
class="flex items-center space-x-2 underlined" class="flex items-center space-x-2 underlined">
title="{subitem.title}">
<f:if condition="{subitem.data.tx_eptheme_context_country_code}"> <f:if condition="{subitem.data.tx_eptheme_context_country_code}">
{ep:icon(icon: 'flag-{subitem.data.tx_eptheme_context_country_code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6')} {ep:icon(icon: 'flag-{subitem.data.tx_eptheme_context_country_code -> f:format.case(mode: \'lower\')}', class: 'w-8 h-6')}
</f:if> </f:if>
@@ -137,8 +136,7 @@
<li> <li>
<a href="{subsubitem.link}" <a href="{subsubitem.link}"
class="text-zinc-800 text-lg" class="text-zinc-800 text-lg"
target="_blank" target="_blank">
title="{subsubitem.title}">
{subsubitem.title} {subsubitem.title}
</a> </a>
</li> </li>
@@ -146,8 +144,7 @@
<f:else> <f:else>
<li> <li>
<a href="{f:uri.typolink(parameter: subsubitem.data.uid)}" <a href="{f:uri.typolink(parameter: subsubitem.data.uid)}"
class="text-zinc-800 text-lg" class="text-zinc-800 text-lg">
title="{subsubitem.title}">
{subsubitem.title} {subsubitem.title}
</a> </a>
</li> </li>
@@ -13,8 +13,8 @@
<div class="fixed top-0 left-0 z-100 inset-x-0 px-4 py-2 hover-none:lg:py-4 flex justify-between bg-white shadow-md"> <div class="fixed top-0 left-0 z-100 inset-x-0 px-4 py-2 hover-none:lg:py-4 flex justify-between bg-white shadow-md">
<f:link.typolink parameter="{f:if(condition: settings.logoLink, then: settings.logoLink, else: settings.defaultHomeUid)}" <f:link.typolink parameter="{f:if(condition: settings.logoLink, then: settings.logoLink, else: settings.defaultHomeUid)}"
class="block hover-hover:lg:pb-4" class="block hover-hover:lg:pb-4"
title="{settings.defaultTitle}"> title="zur Startseite">
<f:image class="block h-10 lg:h-12 w-auto" src="{settings.logoImage}" alt="{settings.defaultTitle}"/> <f:image class="block h-10 lg:h-12 w-auto" src="{settings.logoImage}" alt="Logo"/>
</f:link.typolink> </f:link.typolink>
<div class="flex hover-hover:lg:hidden items-center space-x-4"> <div class="flex hover-hover:lg:hidden items-center space-x-4">
<f:if condition="{data.tx_eptheme_hide_searchbar}"> <f:if condition="{data.tx_eptheme_hide_searchbar}">
@@ -53,7 +53,6 @@
<div class="grid grid-cols-4 gap-x-2"> <div class="grid grid-cols-4 gap-x-2">
<a href="tel:{settings.phoneNumber -> v:format.pregReplace(pattern: '/[\-\s]/', replacement: '')}" <a href="tel:{settings.phoneNumber -> v:format.pregReplace(pattern: '/[\-\s]/', replacement: '')}"
class="button bg-button flex items-center space-x-2" class="button bg-button flex items-center space-x-2"
title="Anrufen"
rel="nofollow"> rel="nofollow">
{ep:icon(icon: 'phone', class: 'w-6 h-6 text-white')} {ep:icon(icon: 'phone', class: 'w-6 h-6 text-white')}
<span class="hidden sm:block"> <span class="hidden sm:block">
@@ -62,7 +61,6 @@
</a> </a>
<a href="https://api.whatsapp.com/send?phone={settings.whatsAppNumberLink}" <a href="https://api.whatsapp.com/send?phone={settings.whatsAppNumberLink}"
class="button bg-button flex items-center space-x-2" class="button bg-button flex items-center space-x-2"
title="WhatsApp"
rel="nofollow" rel="nofollow"
target="_blank"> target="_blank">
{ep:icon(icon: 'whatsapp', class: 'w-6 h-6 text-white')} {ep:icon(icon: 'whatsapp', class: 'w-6 h-6 text-white')}
@@ -72,8 +70,7 @@
</a> </a>
<f:if condition="{settings.faqPageUid}"> <f:if condition="{settings.faqPageUid}">
<a href="{f:uri.typolink(parameter: settings.faqPageUid)}" <a href="{f:uri.typolink(parameter: settings.faqPageUid)}"
class="button bg-button flex items-center space-x-2" class="button bg-button flex items-center space-x-2">
title="FAQ">
{ep:icon(icon: 'faq', class: 'w-6 h-6 text-white')} {ep:icon(icon: 'faq', class: 'w-6 h-6 text-white')}
<span class="hidden sm:block"> <span class="hidden sm:block">
FAQ FAQ
@@ -82,8 +79,7 @@
</f:if> </f:if>
<f:if condition="{settings.myEpPageUid}"> <f:if condition="{settings.myEpPageUid}">
<f:link.typolink parameter="{settings.myEpPageUid}" <f:link.typolink parameter="{settings.myEpPageUid}"
class="button bg-button flex items-center space-x-2" class="button bg-button flex items-center space-x-2">
title="My E&P">
{ep:icon(icon: 'user', class: 'w-6 h-6 text-white')} {ep:icon(icon: 'user', class: 'w-6 h-6 text-white')}
<span class="hidden sm:block"> <span class="hidden sm:block">
My E&amp;P My E&amp;P
@@ -105,8 +101,7 @@
data-collapse-collapsed-value="{f:if(condition: navitem.active, then: 'false', else: 'true')}"> data-collapse-collapsed-value="{f:if(condition: navitem.active, then: 'false', else: 'true')}">
<div class="flex items-center justify-between px-4 py-2 text-white {f:if(condition: navitem.data.tx_eptheme_navitemclass, then: navitem.data.tx_eptheme_navitemclass, else: 'bg-ep-primary')}"> <div class="flex items-center justify-between px-4 py-2 text-white {f:if(condition: navitem.data.tx_eptheme_navitemclass, then: navitem.data.tx_eptheme_navitemclass, else: 'bg-ep-primary')}">
<a href="{navitem.link}" <a href="{navitem.link}"
class="uppercase text-xl flex-1" class="uppercase text-xl flex-1">
title="{navitem.title}">
{navitem.title} {navitem.title}
</a> </a>
<button type="button" <button type="button"
@@ -124,8 +119,7 @@
<f:else> <f:else>
<li> <li>
<a href="{navitem.link}" <a href="{navitem.link}"
class="block px-4 py-2 text-white uppercase text-xl {f:if(condition: navitem.data.tx_eptheme_navitemclass, then: navitem.data.tx_eptheme_navitemclass, else: 'bg-ep-primary')}" class="block px-4 py-2 text-white uppercase text-xl {f:if(condition: navitem.data.tx_eptheme_navitemclass, then: navitem.data.tx_eptheme_navitemclass, else: 'bg-ep-primary')}">
title="{navitem.title}">
{navitem.title} {navitem.title}
</a> </a>
</li> </li>
@@ -145,8 +139,7 @@
data-collapse-collapsed-value="{f:if(condition: subitem.active, then: 'false', else: 'true')}"> data-collapse-collapsed-value="{f:if(condition: subitem.active, then: 'false', else: 'true')}">
<div class="flex items-center justify-between"> <div class="flex items-center justify-between">
<a href="{subitem.link}" <a href="{subitem.link}"
class="flex-1" class="flex-1">
title="{subitem.title}">
{subitem.title} {subitem.title}
</a> </a>
<button type="button" <button type="button"
@@ -163,9 +156,7 @@
</f:then> </f:then>
<f:else> <f:else>
<li class="py-2"> <li class="py-2">
<a href="{subitem.link}" <a href="{subitem.link}">
class=""
title="{subitem.title}">
{subitem.title} {subitem.title}
</a> </a>
</li> </li>
@@ -6,10 +6,10 @@
<f:if condition="{images}"> <f:if condition="{images}">
<f:if condition="{images -> f:count()} == 1"> <f:if condition="{images -> f:count()} == 1">
<f:then> <f:then>
<f:link.typolink parameter="{images.0.originalResource.link}"> <f:link.typolink parameter="{images.0.originalResource.link}" title="{images.0.title}">
<img src="{f:uri.image(image: images.0, width: '770', height: '430c+100')}" <img src="{f:uri.image(image: images.0, width: '770', height: '430c+100')}"
class="block w-full h-auto mb-4" class="block w-full h-auto mb-4"
alt="{images.0.alternative}" title="{images.0.title}"> alt="{images.0.alternative}">
</f:link.typolink> </f:link.typolink>
</f:then> </f:then>
<f:else> <f:else>
@@ -21,10 +21,10 @@
<f:for each="{images}" as="image" iteration="iteration"> <f:for each="{images}" as="image" iteration="iteration">
<li class="splide__slide"> <li class="splide__slide">
<f:link.typolink parameter="{image.originalResource.link}" <f:link.typolink parameter="{image.originalResource.link}"
class="relative bg-cover bg-center"> class="relative bg-cover bg-center" title="{image.title}">
<img src="{f:uri.image(image: image, width: '770', height: '430c+100')}" <img src="{f:uri.image(image: image, width: '770', height: '430c+100')}"
class="block w-full h-auto" class="block w-full h-auto"
alt="{image.alternative}" title="{image.title}"> alt="{image.alternative}">
</f:link.typolink> </f:link.typolink>
</li> </li>
</f:for> </f:for>
@@ -34,9 +34,9 @@
<div class="hidden md:grid md:grid-cols-5 md:gap-2 md:pt-4 md:pb-8"> <div class="hidden md:grid md:grid-cols-5 md:gap-2 md:pt-4 md:pb-8">
<f:for each="{images}" as="image" iteration="iteration"> <f:for each="{images}" as="image" iteration="iteration">
<f:if condition="{iteration.cycle} <= 5"> <f:if condition="{iteration.cycle} <= 5">
<a href="#" class="block" data-slide="{iteration.index}"> <a href="#" class="block" data-slide="{iteration.index}" title="{image.title}">
<img src="{f:uri.image(image: image, width: '150', height: '85c+100')}" <img src="{f:uri.image(image: image, width: '150', height: '85c+100')}"
class="block w-full h-auto" alt="{image.alternative}" title="{image.title}"> class="block w-full h-auto" alt="{image.alternative}">
</a> </a>
</f:if> </f:if>
</f:for> </f:for>
@@ -31,7 +31,7 @@
</n:link> </n:link>
<div class="md:flex-1"> <div class="md:flex-1">
<h3 class="blog-entry__headline"> <h3 class="blog-entry__headline">
<n:link newsItem="{newsItem}" settings="{settings}" title="{newsItem.title}"> <n:link newsItem="{newsItem}" settings="{settings}">
{newsItem.title} {newsItem.title}
</n:link> </n:link>
</h3> </h3>
@@ -5,7 +5,7 @@
<li><strong>Wir informieren dich,</strong> wenn deine Reise buchbar ist - Trage dich in unsere <li><strong>Wir informieren dich,</strong> wenn deine Reise buchbar ist - Trage dich in unsere
<f:link.typolink parameter="{settings.travelAlertPageUid}">Reisealert-Liste</f:link.typolink> ein!</li> <f:link.typolink parameter="{settings.travelAlertPageUid}">Reisealert-Liste</f:link.typolink> ein!</li>
<li>Du kannst diese aber ggf. auch <strong>vorreservieren</strong>, oder wir helfen dir, eine andere Unterkunft <li>Du kannst diese aber ggf. auch <strong>vorreservieren</strong>, oder wir helfen dir, eine andere Unterkunft
zu finden. Ruf uns an unter <a href="tel:{settings.phoneNumber -> v:format.pregReplace(pattern: '/[\-\s]/', replacement: '')}" title="Service Telefon anrufen" rel="nofollow">{settings.phoneNumber}</a> zu finden. Ruf uns an unter <a href="tel:{settings.phoneNumber -> v:format.pregReplace(pattern: '/[\-\s]/', replacement: '')}" rel="nofollow">{settings.phoneNumber}</a>
oder schreibe an <f:link.email email="[email protected]"/>.</li> oder schreibe an <f:link.email email="[email protected]"/>.</li>
</ul> </ul>
</div> </div>
@@ -20,7 +20,7 @@
hx-target="body" hx-target="body"
hx-swap="beforeend" hx-swap="beforeend"
</f:if> </f:if>
title="{region.name} {product.name} Details und Buchen"> >
<f:if condition="{productImage}"> <f:if condition="{productImage}">
<f:then> <f:then>
<ep:lazyLoadImage image="{productImage}" <ep:lazyLoadImage image="{productImage}"
@@ -84,7 +84,6 @@
hx-target="body" hx-target="body"
hx-swap="beforeend" hx-swap="beforeend"
</f:if> </f:if>
title="{region.name} {product.name} Details und Buchen"
class="flex-1 flex flex-col space-y-1 px-2 py-4 md:p-4"> class="flex-1 flex flex-col space-y-1 px-2 py-4 md:p-4">
<div class="product-teaser__label-name"> <div class="product-teaser__label-name">
{product.name} {product.name}
@@ -1,7 +1,6 @@
<f:if condition="{product.ratingVotesCount} > 0"> <f:if condition="{product.ratingVotesCount} > 0">
<a href="{f:uri.typolink(parameter: targetPageUid)}" <a href="{f:uri.typolink(parameter: targetPageUid)}"
class="block bg-zinc-50 p-4 mb-4" class="block bg-zinc-50 p-4 mb-4">
title="Reisebewertungen">
<p class="font-bold mb-1"> <p class="font-bold mb-1">
{label} {label}
</p> </p>
@@ -10,7 +10,6 @@
<f:link.typolink parameter="{region.awardLink}" title="{region.name}"> <f:link.typolink parameter="{region.awardLink}" title="{region.name}">
<f:image image="{region.awardImage}" <f:image image="{region.awardImage}"
alt="{region.awardImage.alternative}" alt="{region.awardImage.alternative}"
title="{region.awardImage.title}"
maxWidth="165" maxWidth="165"
class="block max-w-full mx-auto" class="block max-w-full mx-auto"
/> />
@@ -21,8 +21,7 @@
loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png" loaderimg="EXT:ep_theme/Resources/Public/images/lazy.png"
class="block w-full h-auto" class="block w-full h-auto"
width="330" width="330"
alt="{regionMap.alternative}" alt="{regionMap.alternative}"/>
title="{regionMap.title}"/>
</a> </a>
</f:for> </f:for>
</div> </div>
@@ -10,8 +10,8 @@
<div class="fixed top-0 left-0 z-100 inset-x-0 px-4 py-2 hover-none:lg:py-4 flex justify-between bg-white shadow-md"> <div class="fixed top-0 left-0 z-100 inset-x-0 px-4 py-2 hover-none:lg:py-4 flex justify-between bg-white shadow-md">
<a href="{f:uri.typolink(parameter: settings.defaultHomeUid)}" <a href="{f:uri.typolink(parameter: settings.defaultHomeUid)}"
class="block hover-hover:lg:pb-4" class="block hover-hover:lg:pb-4"
title="{settings.defaultTitle}"> title="zur Startseite">
<f:image class="block h-10 lg:h-12 w-auto" src="{settings.logoImage}" alt="{settings.defaultTitle}"/> <f:image class="block h-10 lg:h-12 w-auto" src="{settings.logoImage}" alt="Logo"/>
</a> </a>
<button type="button" <button type="button"
aria-label="Suche schließen" aria-label="Suche schließen"
@@ -33,7 +33,7 @@
<f:if condition="{settings.showSkipassBadge} || {badge}"> <f:if condition="{settings.showSkipassBadge} || {badge}">
<div class="herounit__badge-wrapper"> <div class="herounit__badge-wrapper">
<f:if condition="{settings.showSkipassBadge}"> <f:if condition="{settings.showSkipassBadge}">
<f:link.typolink parameter="{settings.skipassPageUid}" title="Skipass inklusive"> <f:link.typolink parameter="{settings.skipassPageUid}">
<div class="herounit__badge herounit__badge--skipass"> <div class="herounit__badge herounit__badge--skipass">
<p class="uppercase text-4xl font-bold leading-7 mb-2">Ski-<br>Pass</p> <p class="uppercase text-4xl font-bold leading-7 mb-2">Ski-<br>Pass</p>
<p class="uppercase">inklusive</p> <p class="uppercase">inklusive</p>
@@ -42,8 +42,7 @@
</f:if> </f:if>
<f:if condition="{badge}"> <f:if condition="{badge}">
<f:alias map="{badgeData: badge.0.data}"> <f:alias map="{badgeData: badge.0.data}">
<f:link.typolink parameter="{badgeData.link}" <f:link.typolink parameter="{badgeData.link}">
title="{badgeData.title}">
<div class="herounit__badge herounit__badge--custom"> <div class="herounit__badge herounit__badge--custom">
<svg viewBox="0 0 200 200" <svg viewBox="0 0 200 200"
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
@@ -26,8 +26,7 @@
class="block w-full h-auto" class="block w-full h-auto"
width="500" width="500"
height="250c-100" height="250c-100"
alt="{image.alternative}" alt="{image.alternative}" />
title="{image.title}" />
</picture> </picture>
</f:then> </f:then>
<f:else> <f:else>
@@ -13,7 +13,7 @@
<source media="(max-width: 768px)" data-srcset="{f:uri.image( <source media="(max-width: 768px)" data-srcset="{f:uri.image(
image: image, width: '320', height: '140c-100' image: image, width: '320', height: '140c-100'
)} 320w"/> )} 320w"/>
<img class="scale lazyload" title="{image.title}" alt="{image.alternative}" <img class="scale lazyload" alt="{image.alternative}"
src="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/lazy.png', width: '260', height: '160')}" src="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/lazy.png', width: '260', height: '160')}"
data-src="{f:uri.image(image: image, width: '260', height: '160c-100')}" data-src="{f:uri.image(image: image, width: '260', height: '160c-100')}"
> >
@@ -6,12 +6,10 @@
<f:render partial="Header/Header" arguments="{header: data.header, subheader: data.subheader, layout: data.header_layout, link: data.header_link, default: settings.defaultHeaderType}" /> <f:render partial="Header/Header" arguments="{header: data.header, subheader: data.subheader, layout: data.header_layout, link: data.header_link, default: settings.defaultHeaderType}" />
{data.bodytext -> f:format.html()} {data.bodytext -> f:format.html()}
<f:if condition="{files}"> <f:if condition="{files}">
<f:link.typolink parameter="{files.0.link}"> <f:link.typolink parameter="{files.0.link}" title="{files.0.originalResource.title}">
<img class="img-responsive lazyload" <img class="img-responsive lazyload"
data-src="{f:uri.image(image: files.0, maxWidth: '770')}" data-src="{f:uri.image(image: files.0, maxWidth: '770')}"
alt="{files.0.originalResource.alternative}" alt="{files.0.originalResource.alternative}">
title="{files.0.originalResource.title}"
>
</f:link.typolink> </f:link.typolink>
</f:if> </f:if>
</f:section> </f:section>
@@ -30,8 +30,7 @@
class="block w-full h-auto" class="block w-full h-auto"
width="400c" width="400c"
height="400" height="400"
alt="{image.alternative}" alt="{image.alternative}" />
title="{image.title}" />
</f:link.typolink> </f:link.typolink>
</div> </div>
</f:section> </f:section>
@@ -12,10 +12,10 @@
<f:if condition="{settings.mainSitePid}"> <f:if condition="{settings.mainSitePid}">
<f:link.typolink parameter="{settings.mainSitePid}" <f:link.typolink parameter="{settings.mainSitePid}"
class="topnav__item" class="topnav__item"
title="{settings.defaultTitle}"> title="zur Startseite">
<f:image src="EXT:ep_theme/Resources/Public/images/logo.svg" <f:image src="EXT:ep_theme/Resources/Public/images/logo.svg"
class="h-5 w-auto" class="h-5 w-auto"
alt="{settings.defaultTitle}"/> alt="Logo"/>
</f:link.typolink> </f:link.typolink>
</f:if> </f:if>
<f:link.typolink parameter="{settings.defaultHomeUid}" class="topnav__item" title="E&amp;P"> <f:link.typolink parameter="{settings.defaultHomeUid}" class="topnav__item" title="E&amp;P">
@@ -26,8 +26,7 @@
<div class="flex-1 flex items-center"> <div class="flex-1 flex items-center">
<f:for each="{topnav}" as="menuitem"> <f:for each="{topnav}" as="menuitem">
<a class="topnav__item flex-grow{f:if(condition: menuitem.data.tx_eptheme_navitemclass, then: ' {menuitem.data.tx_eptheme_navitemclass}')}{f:if(condition: '{menuitem.active} || {menuitem.data.uid} == {settings.forceActiveTopnavUid}', then: ' bg-ep-secondary')}" <a class="topnav__item flex-grow{f:if(condition: menuitem.data.tx_eptheme_navitemclass, then: ' {menuitem.data.tx_eptheme_navitemclass}')}{f:if(condition: '{menuitem.active} || {menuitem.data.uid} == {settings.forceActiveTopnavUid}', then: ' bg-ep-secondary')}"
href="{menuitem.link}"{f:if(condition: '{menuitem.data.doktype} == 3', then: ' target="_blank"')} href="{menuitem.link}"{f:if(condition: '{menuitem.data.doktype} == 3', then: ' target="_blank"')}>
title="{menuitem.title}">
{menuitem.title} {menuitem.title}
</a> </a>
</f:for> </f:for>
@@ -33,6 +33,7 @@
<button type="button" <button type="button"
class="opacity-50" class="opacity-50"
data-action="teasergrid#grid" data-action="teasergrid#grid"
aria-label="kompakte Ansicht"
data-teasergrid-target="button"> data-teasergrid-target="button">
<svg class="w-12 h-12 text-ep-primary"> <svg class="w-12 h-12 text-ep-primary">
<use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-teaser-grid"></use> <use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-teaser-grid"></use>
@@ -40,6 +41,7 @@
</button> </button>
<button type="button" <button type="button"
data-action="teasergrid#block" data-action="teasergrid#block"
aria-label="vergrößerte Ansicht"
data-teasergrid-target="button"> data-teasergrid-target="button">
<svg class="w-12 h-12 text-ep-primary"> <svg class="w-12 h-12 text-ep-primary">
<use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-teaser-single"></use> <use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-teaser-single"></use>
@@ -10,6 +10,7 @@
style="background-image: url({f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/lazy.png')})"> style="background-image: url({f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/lazy.png')})">
<iframe class="absolute top-0 left-0 w-full h-full" <iframe class="absolute top-0 left-0 w-full h-full"
width="640" height="360" allowfullscreen width="640" height="360" allowfullscreen
title="eingebettetes Video"
data-src="{ep:uri.video(value: data.header_link, layout: data.layout)}" data-src="{ep:uri.video(value: data.header_link, layout: data.layout)}"
data-cookiefirst-category="advertising"></iframe> data-cookiefirst-category="advertising"></iframe>
<div class="cookiefirst-disabled-resource"> <div class="cookiefirst-disabled-resource">
@@ -46,6 +46,7 @@
data-action="click->collapse#toggle" data-action="click->collapse#toggle"
class="w-full bg-transparent border-0 ring-0 focus:ring-0 text-white uppercase px-2 py-1 cursor-pointer placeholder-white" class="w-full bg-transparent border-0 ring-0 focus:ring-0 text-white uppercase px-2 py-1 cursor-pointer placeholder-white"
placeholder="Zeitraum" placeholder="Zeitraum"
aria-label="Zeitraum"
value="{ep:dateRange(dateFrom: searchParams.dateFrom, dateTo: searchParams.dateTo, includeLabel: 0)}" value="{ep:dateRange(dateFrom: searchParams.dateFrom, dateTo: searchParams.dateTo, includeLabel: 0)}"
data-searchbar-target="dateRangeLabel"/> data-searchbar-target="dateRangeLabel"/>
<svg class="w-6 h-6 text-white absolute right-0 top-0 mr-2 mt-1 cursor-pointer" <svg class="w-6 h-6 text-white absolute right-0 top-0 mr-2 mt-1 cursor-pointer"
@@ -57,6 +58,7 @@
<div class="flex justify-between divide-x divide-zinc-200"> <div class="flex justify-between divide-x divide-zinc-200">
<div class="pr-2"> <div class="pr-2">
<input type="hidden" <input type="hidden"
aria-label="Zeitraum"
data-datepicker-target="field"> data-datepicker-target="field">
</div> </div>
<div class="flex-1 flex flex-col justify-between pl-2"> <div class="flex-1 flex flex-col justify-between pl-2">
@@ -100,6 +102,7 @@
<input type="text" <input type="text"
data-action="click->collapse#toggle" data-action="click->collapse#toggle"
data-searchbar-target="paxLabel" data-searchbar-target="paxLabel"
aria-label="Personenzahl"
value="{searchParams.pax}" value="{searchParams.pax}"
class="w-full bg-transparent border-0 ring-0 focus:ring-0 text-white uppercase px-2 py-1 cursor-pointer"/> class="w-full bg-transparent border-0 ring-0 focus:ring-0 text-white uppercase px-2 py-1 cursor-pointer"/>
<svg class="w-6 h-6 text-white absolute right-0 top-0 mr-2 mt-1 cursor-pointer" <svg class="w-6 h-6 text-white absolute right-0 top-0 mr-2 mt-1 cursor-pointer"
@@ -139,6 +142,7 @@
<input type="text" <input type="text"
data-action="click->collapse#toggle" data-action="click->collapse#toggle"
data-searchbar-target="destinationLabel" data-searchbar-target="destinationLabel"
aria-label="Reiseziel/Konzept"
class="w-full bg-transparent border-0 ring-0 focus:ring-0 text-white uppercase px-2 py-1 cursor-pointer placeholder-white" class="w-full bg-transparent border-0 ring-0 focus:ring-0 text-white uppercase px-2 py-1 cursor-pointer placeholder-white"
placeholder="Reiseziel/Konzept"/> placeholder="Reiseziel/Konzept"/>
<svg <svg
@@ -161,9 +165,7 @@
<svg class="block w-8 h-6"> <svg class="block w-8 h-6">
<use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-flag-{destination.country.code -> f:format.case(mode: 'lower')}"></use> <use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-flag-{destination.country.code -> f:format.case(mode: 'lower')}"></use>
</svg> </svg>
<span> <span>{destination.country.label}</span>
{destination.country.label}
</span>
</button> </button>
</div> </div>
<div class="col-span-3 flex flex-col items-start space-y-1"> <div class="col-span-3 flex flex-col items-start space-y-1">
@@ -212,6 +214,7 @@
data-collapse-collapsed-value="true"> data-collapse-collapsed-value="true">
<div class="relative border-r border-b border-white/50"> <div class="relative border-r border-b border-white/50">
<input type="text" <input type="text"
aria-label="Preis"
data-action="click->collapse#toggle" data-action="click->collapse#toggle"
data-searchbar-target="priceRangeLabel" data-searchbar-target="priceRangeLabel"
class="w-full bg-transparent border-0 ring-0 focus:ring-0 text-white uppercase px-2 py-1 cursor-pointer placeholder-white" class="w-full bg-transparent border-0 ring-0 focus:ring-0 text-white uppercase px-2 py-1 cursor-pointer placeholder-white"
@@ -251,7 +254,7 @@
</div> </div>
<button type="submit" <button type="submit"
class="hidden reduced:block reduced:ml-4"> class="hidden reduced:block reduced:ml-4" title="Suchen">
<svg class="w-8 h-8 text-white bg-badge-gradient"> <svg class="w-8 h-8 text-white bg-badge-gradient">
<use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-chevron-right"></use> <use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-chevron-right"></use>
</svg> </svg>