Skip to content

Commit

Permalink
TMS-1067: Show price-info for event in listing if it's free
Browse files Browse the repository at this point in the history
  • Loading branch information
eebbi committed Sep 16, 2024
1 parent b14ec45 commit a62ffdb
Show file tree
Hide file tree
Showing 4 changed files with 67 additions and 41 deletions.
2 changes: 2 additions & 0 deletions CHANGELOG.MD
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,8 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.

## [Unreleased]

- TMS-1067: Show price-info for event in listing if it's free

## [1.3.1] - 2024-08-21

- TMS-1057: Increase articles lead-text font-size
Expand Down
48 changes: 30 additions & 18 deletions partials/ui/event-highlight.dust
Original file line number Diff line number Diff line change
@@ -1,51 +1,63 @@
<div class="column is-6 is-4-desktop mb-4 mb-0-desktop">
<div class="events__item has-height-100 is-flex is-flex-direction-column {classes.event_item_bg}">
<div class="events__item has-height-100 is-flex is-flex-direction-column {classes.event_item_bg|attr}">
{?image}
<div class="image is-16by9" aria-hidden="true">
<a href="{url}" aria-hidden="true" tabindex="-1">
<img src="{image}" loading="lazy" alt="" class="objectfit-image">
<a href="{url|url}" aria-hidden="true" tabindex="-1">
<img src="{image|url}" loading="lazy" alt="" class="objectfit-image">
</a>
</div>
{/image}

<div class="events__item-inner has-height-100 pt-5 pr-6 pb-6 pl-6">
<h3 class="h5 mt-0 mb-5">
<a href="{url}" class="has-text-black">
{name|s}
<a href="{url|url}" class="has-text-black">
{name|html}
</a>
</h3>

{>"ui/event-item-pill" /}

<div class="is-flex is-align-items-center mt-2 mb-2 {classes.event_item_text}">
<span class="is-flex" aria-label="{Strings.s.event.date|s}">
{>"ui/icon" icon="date" class="icon--large is-primary mr-4 {classes.event_item_icon}" /}
<div class="is-flex is-align-items-center mt-2 mb-2 {classes.event_item_text|attr}">
<span class="is-flex" aria-label="{Strings.s.event.date|attr}">
{>"ui/icon" icon="date" class="icon--large is-primary mr-4 {classes.event_item_icon|attr}" /}
</span>

{date|s}
{date|html}
</div>

<div class="is-flex is-align-items-center mt-2 mb-2 {classes.event_item_text}">
<span class="is-flex" aria-label="{Strings.s.event.time|s}">
{>"ui/icon" icon="time" class="icon--large is-primary mr-4 {classes.event_item_icon}" /}
<div class="is-flex is-align-items-center mt-2 mb-2 {classes.event_item_text|attr}">
<span class="is-flex" aria-label="{Strings.s.event.time|attr}">
{>"ui/icon" icon="time" class="icon--large is-primary mr-4 {classes.event_item_icon|attr}" /}
</span>

{time|s}
{time|html}
</div>

{?location.name}
<div class="is-flex is-align-items-center mt-2 mb-2 {classes.event_item_text}">
<span class="is-flex" aria-label="{Strings.s.event.location|s}">
{>"ui/icon" icon="location" class="icon--large is-primary mr-4 {classes.event_item_icon}" /}
<div class="is-flex is-align-items-center mt-2 mb-2 {classes.event_item_text|attr}">
<span class="is-flex" aria-label="{Strings.s.event.location|attr}">
{>"ui/icon" icon="location" class="icon--large is-primary mr-4 {classes.event_item_icon|attr}" /}
</span>

{location.name|s}
{location.name|html}
</div>
{/location.name}

{#price}
{?is_free}
<div class="is-flex is-align-items-center mt-2 mb-2 {classes.event_item_text|attr}">
<span class="is-flex" aria-label="{Strings.s.event.price|attr}">
{>"ui/icon" icon="euro" class="icon--large is-primary mr-4 {classes.event_item_icon|attr}" /}
</span>

{price|html}
</div>
{/is_free}
{/price}

{?url}
<a href="{url}" class="button is-primary is-outlined is-small is-hidden-desktop mt-4">
{Strings.s.common.read_more|s}
{Strings.s.common.read_more|html}
</a>
{/url}
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -50,5 +50,17 @@
{location.name|html}
</div>
{/location.name}

{#price}
{?is_free}
<div class="is-flex is-align-items-center mt-2 mb-2 {classes.event_item_text|attr}">
<span class="is-flex" aria-label="{Strings.s.event.price|attr}">
{>"ui/icon" icon="euro" class="icon--large is-primary mr-4 {item_classes.grid.icon|attr}" /}
</span>

{price|html}
</div>
{/is_free}
{/price}
</div>
</div>
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
<div class="events__item columns is-gapless mt-4 mb-4 has-border has-border-1 {item_classes.list.item|s}">
<div class="events__item columns is-gapless mt-4 mb-4 has-border has-border-1 {item_classes.list.item|attr}">
{?image}
<div class="column is-4 is-relative">
<a href="{url}" class="is-hidden-mobile is-overlay has-background-cover" aria-hidden="true"
<a href="{url|url}" class="is-hidden-mobile is-overlay has-background-cover" aria-hidden="true"
tabindex="-1" {@inlinebg url=image /}></a>

<div class="image is-16by9 is-hidden-tablet" aria-hidden="true">
<a href="{url}" aria-hidden="true" tabindex="-1">
<img src="{image}" alt="" class="objectfit-image">
<a href="{url|url}" aria-hidden="true" tabindex="-1">
<img src="{image|url}" alt="" class="objectfit-image">
</a>
</div>

{?primary_keyword}
<span
class="is-absolute has-top-1 has-left-1 pill is-bordered has-background-primary-invert has-text-primary">
{primary_keyword|s}
{primary_keyword|html}
</span>
{/primary_keyword}
</div>
Expand All @@ -22,45 +22,45 @@
<div class="column">
<div class="events__item-inner pt-5 pr-6 pb-6 pl-6">
<h3 class="h5 mt-0 mb-5">
<a href="{url}">
{name|s}
<a href="{url|url}">
{name|html}
</a>
</h3>

<div class="is-flex is-flex-wrap-wrap">
<div class="is-flex is-align-items-center mt-2 mb-2 mr-4 {item_classes.list.meta_label|s}">
<span class="is-flex" aria-label="{Strings.s.event.date|s}">
{>"ui/icon" icon="date" class="icon--large is-primary mr-2 {item_classes.list.icon|s}" /}
<div class="is-flex is-align-items-center mt-2 mb-2 mr-4 {item_classes.list.meta_label|attr}">
<span class="is-flex" aria-label="{Strings.s.event.date|attr}">
{>"ui/icon" icon="date" class="icon--large is-primary mr-2 {item_classes.list.icon|attr}" /}
</span>

{date|s}
{date|html}
</div>

<div class="is-flex is-align-items-center mt-2 mb-2 mr-4 {item_classes.list.meta_label|s}">
<span class="is-flex" aria-label="{Strings.s.event.time|s}">
{>"ui/icon" icon="time" class="icon--large is-primary mr-2 {item_classes.list.icon|s}" /}
<div class="is-flex is-align-items-center mt-2 mb-2 mr-4 {item_classes.list.meta_label|attr}">
<span class="is-flex" aria-label="{Strings.s.event.time|attr}">
{>"ui/icon" icon="time" class="icon--large is-primary mr-2 {item_classes.list.icon|attr}" /}
</span>

{time|s}
{time|html}
</div>

{?location.name}
<div class="is-flex is-align-items-center mt-2 mb-2 {item_classes.list.meta_label|s}">
<span class="is-flex" aria-label="{Strings.s.event.location|s}">
{>"ui/icon" icon=location_icon class="icon--large is-primary mr-2 {item_classes.list.icon|s}" /}
<div class="is-flex is-align-items-center mt-2 mb-2 {item_classes.list.meta_label|attr}">
<span class="is-flex" aria-label="{Strings.s.event.location|attr}">
{>"ui/icon" icon=location_icon class="icon--large is-primary mr-2 {item_classes.list.icon|attr}" /}
</span>

{location.name|s}
{location.name|html}
</div>
{/location.name}
</div>

<p class="has-text-small {item_classes.list.description|s}">
{short_description|s}
<p class="has-text-small {item_classes.list.description|attr}">
{short_description|kses}
</p>

<a href="{url}" class="button is-primary is-small mt-4">
{Strings.s.common.read_more|s}
<a href="{url|url}" class="button is-primary is-small mt-4">
{Strings.s.common.read_more|html}
</a>
</div>
</div>
Expand Down

0 comments on commit a62ffdb

Please sign in to comment.