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

WIP Migrate searchresult

Browse Source
This commit is contained in:
Björn Fromme
2021-07-27 14:06:11 +02:00
parent 13e319d595
commit 20bacdd8cb
1 changed files with 128 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/typo3conf/ext/ep_theme/Resources/Private/Partials/Product/SearchresultItem.html
+128
View File
@@ -0,0 +1,128 @@
<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="teaserbox teaserbox--landscape teaserbox--searchresult searchresult-item">
<div class="teaserbox__image">
<img class="teaserbox__flag" :src="item.country.flag" :alt="item.country.name"/>
<a :href="url" rel="nofollow" title="Details &amp; Buchen">
<picture class="searchresult-item__image">
<source media="(min-width: 1201px)" data-srcset="{f:uri.image(image: item.hotel.images.0, width: '260', height: '200c-100')} 260w'"/>
<source media="(max-width: 1200px)" data-srcset="{f:uri.image(image: item.hotel.images.0, width: '280', height: '220c-100')} 280w'"/>
<source media="(max-width: 768px)" data-srcset="{f:uri.image(image: item.hotel.images.0, width: '220', height: '130c-100')} 220w'"/>
<img data-src="{f:uri.image(image: item.hotel.images.0, width: '220', height: '130c-100')}"
class="scale lazyload"
title="{item.hotel.images.0.title}"
alt="{item.hotel.images0.alt}">
</picture>
</a>
<div class="concept-badge concept-badge--{section.concept.code}" id="{section.concept.code}">
{section.concept.name}
</div>
</div>
<div class="teaserbox__main">
<div class="teaserbox__header">
<span class="searchresult-item__headline">
{item.region.name}
<f:if condition="{section.concept.code} == 'evt'">
<br><strong>{item.product.name}</strong>
</f:if>
</span>
<span class="searchresult-item__subline">
{item.hotel.name}
</span>
<f:if condition="{item.hotel.category}">
<span class="searchresult-item__category">
Kategorie {item.hotel.category}
</span>
</f:if>
</div>
<ul class="check-list searchresult-item__checklist">
<f:if condition="{item.hotel.fact}">
<li>
{item.hotel.fact}
</li>
</f:if>
<f:if condition="{item.product.fact}">
<li>
{item.product.fact}
</li>
</f:if>
<f:if condition="{item.region.feature}">
<f:then>
<li>
{item.region.feature}
</li>
</f:then>
<f:else>
<f:if condition="{item.region.fact}">
<li>
{item.region.fact}
</li>
</f:if>
</f:else>
</f:if>
</ul>
<ul class="check-list check-list--inverted searchresult-item__featurelist">
<li>
Skipass
</li>
<f:if condition="{item.board}">
<li>
{item.board}
</li>
</f:if>
<f:if condition="{item.product.feature}">
<li>
{item.product.feature}
</li>
</f:if>
</ul>
</div>
<div class="teaserbox__aside">
<div class="teaserbox__aside__top">
<span class="searchresult-item__label">
{f:if(condition: '{item.dates -> f:count()} > 1', then: 'Zeitraum', else: 'Termin')}
</span>
<span class="searchresult-item__daterange">
{dateRange}
</span>
<f:if condition="{item.dates -> f:count()}">
<f:if condition="{item.daytrip}">
<f:else>
<a :href="url" rel="nofollow" title="Details &amp; Buchen">
<span class="searchresult-item__daterange">
<i class="fa fa-arrow-circle-right"></i> {item.dates -> f:count()} {f:if(condition: '{item.dates -> f:count()} > 1', then: 'Termine', else: 'Termin')}
</span>
</a>
</f:else>
</f:if>
</f:if>
<hr>
<span class="searchresult-item__label">
{f:if(condition: item.daytrip, then: 'Tageweise buchbar', else: nightsOptions)}
</span>
</div>
<div class="teaserbox__aside__bottom">
<span class="searchresult-item__price">
ab {item.minPrice} €
</span>
<a :href="url"
class="button button--full searchresult-item__button"
rel="nofollow" title="Details">
Details{f:if(condition: item.hideBookingButton, else: ' &amp; Buchen')}
</a>
</div>
</div>
<a href="#"
data-controller="watchlist-toggle"
data-watchlist-toggle-uid-value="{item.key}"
data-action="watchlist-toggle#toggle">
<span data-microtip-position="top" data-watchlist-toggle-target="tooltip" role="tooltip">
<i class="fa" data-watchlist-toggle-target="icon"></i>
</span>
</a>
</div>
</html>