Show skipass badge on product pages

This commit is contained in:
Björn Fromme
2018-09-05 16:13:49 +02:00
parent 33d057220d
commit 8b3000bbcd
7 changed files with 46 additions and 17 deletions
@@ -14,5 +14,6 @@ plugin.tx_epproducts {
bpnBookingUrlTemplateCode = {$plugin.tx_eptheme.settings.bpnBookingUrlTemplateCode} bpnBookingUrlTemplateCode = {$plugin.tx_eptheme.settings.bpnBookingUrlTemplateCode}
showSkipassBadge = {$plugin.tx_eptheme.settings.showSkipassBadge} showSkipassBadge = {$plugin.tx_eptheme.settings.showSkipassBadge}
ratingWidgetLabel = {$plugin.tx_eptheme.settings.ratingWidgetLabel} ratingWidgetLabel = {$plugin.tx_eptheme.settings.ratingWidgetLabel}
skipassPageUid = {$plugin.tx_eptheme.settings.skipassPageUid}
} }
} }
@@ -45,6 +45,8 @@ plugin.tx_eptheme {
ratingPageUid = ratingPageUid =
# cat=eptheme/200/260; type=string; label=Watchlist page UID # cat=eptheme/200/260; type=string; label=Watchlist page UID
watchlistPageUid = watchlistPageUid =
# cat=eptheme/200/270; type=string; label=Skipass info page UID
skipassPageUid =
# cat=eptheme/400/100; type=string; label=Phone number general # cat=eptheme/400/100; type=string; label=Phone number general
phoneNumber = 0221 - 272 276 0 phoneNumber = 0221 - 272 276 0
@@ -83,6 +83,7 @@ plugin.tx_eptheme {
blogDetailPageUid = {$plugin.tx_eptheme.settings.blogDetailPageUid} blogDetailPageUid = {$plugin.tx_eptheme.settings.blogDetailPageUid}
ratingPageUid = {$plugin.tx_eptheme.settings.ratingPageUid} ratingPageUid = {$plugin.tx_eptheme.settings.ratingPageUid}
watchlistPageUid = {$plugin.tx_eptheme.settings.watchlistPageUid} watchlistPageUid = {$plugin.tx_eptheme.settings.watchlistPageUid}
skipassPageUid = {$plugin.tx_eptheme.settings.skipassPageUid}
} }
view { view {
templateRootPaths.0 = EXT:ep_theme/Resources/Private/Templates templateRootPaths.0 = EXT:ep_theme/Resources/Private/Templates
@@ -61,6 +61,13 @@
top: 36px; top: 36px;
right: 8px; right: 8px;
&--skipass {
width: 75px;
height: auto;
top: 32px;
right: 45px;
}
.custom-badge__title { .custom-badge__title {
font-size: 20px; font-size: 20px;
} }
@@ -79,11 +86,22 @@
font-size: 16px; font-size: 16px;
} }
right: 5%; right: 5%;
&--skipass {
width: 100px;
height: auto;
}
} }
@include mq($from: desktop) { @include mq($from: desktop) {
top: 64px; top: 64px;
right: -64px; right: -64px;
&--skipass {
top: -110px;
right: -150px;
}
} }
} }
@@ -22,17 +22,20 @@
</div> </div>
</div> </div>
<f:if condition="{settings.showSkipassBadge}"> <f:if condition="{settings.showSkipassBadge}">
<f:image src="EXT:ep_theme/Resources/Public/images/badge_skipass.png" alt="Skipass inklusive" class="herounit__badge herounit__badge--skipass" /> <f:link.typolink parameter="{settings.skipassPageUid}" title="Skipass inklusive">
<f:image src="EXT:ep_theme/Resources/Public/images/badge_skipass.png"
alt="Skipass inklusive" class="herounit__badge herounit__badge--skipass" />
</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}" title="{badgeData.title}"> <f:link.typolink parameter="{badgeData.link}" title="{badgeData.title}">
<div class="herounit__badge herounit__badge--custom custom-badge"> <div class="herounit__badge herounit__badge--custom custom-badge">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" <svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet"
preserveAspectRatio="xMinYMin meet" viewBox="0 0 200 200" class="custom-badge__background"> viewBox="0 0 200 200" class="custom-badge__background">
<g> <g>
<circle id="bgouter" cx="100" cy="100" r="100"/> <circle id="bgouter" cx="100" cy="100" r="100"></circle>
<circle id="bginner" cx="100" cy="100" r="70"/> <circle id="bginner" cx="100" cy="100" r="70"></circle>
</g> </g>
</svg> </svg>
<div class="custom-badge__content"> <div class="custom-badge__content">
@@ -23,17 +23,20 @@
</div> </div>
</div> </div>
<f:if condition="{settings.showSkipassBadge}"> <f:if condition="{settings.showSkipassBadge}">
<f:image src="EXT:ep_theme/Resources/Public/images/badge_skipass.png" alt="Skipass inklusive" class="pagehead__badge pagehead__badge--skipass" /> <f:link.typolink parameter="{settings.skipassPageUid}" title="Skipass inklusive">
<f:image src="EXT:ep_theme/Resources/Public/images/badge_skipass.png" alt="Skipass inklusive"
class="pagehead__badge pagehead__badge--skipass" />
</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}" title="{badgeData.title}"> <f:link.typolink parameter="{badgeData.link}" title="{badgeData.title}">
<div class="pagehead__badge pagehead__badge--custom custom-badge"> <div class="pagehead__badge pagehead__badge--custom custom-badge">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" <svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet"
preserveAspectRatio="xMinYMin meet" viewBox="0 0 200 200" class="custom-badge__background"> viewBox="0 0 200 200" class="custom-badge__background">
<g> <g>
<circle id="bgouter" cx="100" cy="100" r="100"/> <circle id="bgouter" cx="100" cy="100" r="100"></circle>
<circle id="bginner" cx="100" cy="100" r="70"/> <circle id="bginner" cx="100" cy="100" r="70"></circle>
</g> </g>
</svg> </svg>
<div class="custom-badge__content"> <div class="custom-badge__content">
@@ -36,17 +36,18 @@
</a> </a>
</f:else> </f:else>
</f:if> </f:if>
<f:if condition="{product.skipassIncluded}"> <f:link.typolink parameter="{settings.skipassPageUid}" title="Skipass inklusive">
<a href="#" class="ep-property">inkl. Skipass</a> <f:image src="EXT:ep_theme/Resources/Public/images/badge_skipass.png"
</f:if> alt="Skipass inklusive" class="product-header__badge product-header__badge--skipass" />
</f:link.typolink>
<f:if condition="{product.badge}"> <f:if condition="{product.badge}">
<f:link.typolink parameter="{product.badge.link}" title="{product.badge.title}"> <f:link.typolink parameter="{product.badge.link}" title="{product.badge.title}">
<div class="product-header__badge product-header__badge--custom custom-badge"> <div class="product-header__badge product-header__badge--custom custom-badge">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" <svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet"
preserveAspectRatio="xMinYMin meet" viewBox="0 0 200 200" class="custom-badge__background"> viewBox="0 0 200 200" class="custom-badge__background">
<g> <g>
<circle id="bgouter" cx="100" cy="100" r="100"/> <circle id="bgouter" cx="100" cy="100" r="100"></circle>
<circle id="bginner" cx="100" cy="100" r="70"/> <circle id="bginner" cx="100" cy="100" r="70"></circle>
</g> </g>
</svg> </svg>
<div class="custom-badge__content"> <div class="custom-badge__content">