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}
showSkipassBadge = {$plugin.tx_eptheme.settings.showSkipassBadge}
ratingWidgetLabel = {$plugin.tx_eptheme.settings.ratingWidgetLabel}
skipassPageUid = {$plugin.tx_eptheme.settings.skipassPageUid}
}
}
@@ -45,6 +45,8 @@ plugin.tx_eptheme {
ratingPageUid =
# cat=eptheme/200/260; type=string; label=Watchlist page UID
watchlistPageUid =
# cat=eptheme/200/270; type=string; label=Skipass info page UID
skipassPageUid =
# cat=eptheme/400/100; type=string; label=Phone number general
phoneNumber = 0221 - 272 276 0
@@ -83,6 +83,7 @@ plugin.tx_eptheme {
blogDetailPageUid = {$plugin.tx_eptheme.settings.blogDetailPageUid}
ratingPageUid = {$plugin.tx_eptheme.settings.ratingPageUid}
watchlistPageUid = {$plugin.tx_eptheme.settings.watchlistPageUid}
skipassPageUid = {$plugin.tx_eptheme.settings.skipassPageUid}
}
view {
templateRootPaths.0 = EXT:ep_theme/Resources/Private/Templates
@@ -61,6 +61,13 @@
top: 36px;
right: 8px;
&--skipass {
width: 75px;
height: auto;
top: 32px;
right: 45px;
}
.custom-badge__title {
font-size: 20px;
}
@@ -79,11 +86,22 @@
font-size: 16px;
}
right: 5%;
&--skipass {
width: 100px;
height: auto;
}
}
@include mq($from: desktop) {
top: 64px;
right: -64px;
&--skipass {
top: -110px;
right: -150px;
}
}
}
@@ -22,17 +22,20 @@
</div>
</div>
<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 condition="{badge}">
<f:alias map="{badgeData: badge.0.data}">
<f:link.typolink parameter="{badgeData.link}" title="{badgeData.title}">
<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"
preserveAspectRatio="xMinYMin meet" viewBox="0 0 200 200" class="custom-badge__background">
<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet"
viewBox="0 0 200 200" class="custom-badge__background">
<g>
<circle id="bgouter" cx="100" cy="100" r="100"/>
<circle id="bginner" cx="100" cy="100" r="70"/>
<circle id="bgouter" cx="100" cy="100" r="100"></circle>
<circle id="bginner" cx="100" cy="100" r="70"></circle>
</g>
</svg>
<div class="custom-badge__content">
@@ -23,17 +23,20 @@
</div>
</div>
<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 condition="{badge}">
<f:alias map="{badgeData: badge.0.data}">
<f:link.typolink parameter="{badgeData.link}" title="{badgeData.title}">
<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"
preserveAspectRatio="xMinYMin meet" viewBox="0 0 200 200" class="custom-badge__background">
<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet"
viewBox="0 0 200 200" class="custom-badge__background">
<g>
<circle id="bgouter" cx="100" cy="100" r="100"/>
<circle id="bginner" cx="100" cy="100" r="70"/>
<circle id="bgouter" cx="100" cy="100" r="100"></circle>
<circle id="bginner" cx="100" cy="100" r="70"></circle>
</g>
</svg>
<div class="custom-badge__content">
@@ -36,17 +36,18 @@
</a>
</f:else>
</f:if>
<f:if condition="{product.skipassIncluded}">
<a href="#" class="ep-property">inkl. Skipass</a>
</f:if>
<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="product-header__badge product-header__badge--skipass" />
</f:link.typolink>
<f:if condition="{product.badge}">
<f:link.typolink parameter="{product.badge.link}" title="{product.badge.title}">
<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"
preserveAspectRatio="xMinYMin meet" viewBox="0 0 200 200" class="custom-badge__background">
<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet"
viewBox="0 0 200 200" class="custom-badge__background">
<g>
<circle id="bgouter" cx="100" cy="100" r="100"/>
<circle id="bginner" cx="100" cy="100" r="70"/>
<circle id="bgouter" cx="100" cy="100" r="100"></circle>
<circle id="bginner" cx="100" cy="100" r="70"></circle>
</g>
</svg>
<div class="custom-badge__content">