hr-design-system-handlebars 1.15.0 → 1.16.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +25 -0
- package/dist/assets/index.css +3 -3
- package/dist/views/components/base/link.hbs +5 -10
- package/dist/views/components/button/link_button.hbs +2 -2
- package/dist/views/components/content_nav/content_nav_item.hbs +17 -21
- package/dist/views/components/event/calendar/event_calendar_event_teaser.hbs +4 -4
- package/dist/views/components/event/calendar/event_calendar_footer.hbs +2 -3
- package/dist/views/components/event/event_ticket_button.hbs +2 -2
- package/dist/views/components/site_header/navigation_flyout/navigation_flyout_item.hbs +9 -4
- package/dist/views/components/site_header/section_navigation/section_navigation_top_topics.hbs +2 -3
- package/dist/views/components/teaser/cluster/teaser_cluster.hbs +1 -1
- package/dist/views/components/teaser/cluster/teaser_cluster_item.hbs +7 -7
- package/dist/views/components/teaser/components/teaser_body.hbs +26 -19
- package/dist/views/components/teaser/components/teaser_comments.hbs +2 -2
- package/dist/views/components/teaser/components/teaser_image.hbs +1 -1
- package/dist/views/components/teaser/components/teaser_lead.hbs +1 -1
- package/dist/views/components/teaser/components/teaser_text.hbs +2 -2
- package/dist/views/components/teaser/components/teaser_ticker_body.hbs +3 -4
- package/dist/views/components/teaser/podcast/podcast_item_title.hbs +5 -7
- package/dist/views/components/teaser/podcast/podcast_player_ui.hbs +1 -2
- package/dist/views/components/teaser/podcast/podcast_playlist_player.hbs +3 -5
- package/dist/views/components/teaser/podcast/podcast_title.hbs +3 -3
- package/dist/views/components/teaser/stage/stage_text.hbs +2 -2
- package/dist/views/components/teaser/tabbox/group_tabbox.hbs +1 -1
- package/dist/views/components/teaser/teaser_poster.hbs +3 -3
- package/dist/views/components/teaser/ticker/teaser_ticker.hbs +1 -1
- package/dist/views/components/tracking/download_tracking.hbs +2 -0
- package/dist/views/components/tracking/navigation_tracking.hbs +4 -0
- package/package.json +1 -1
- package/src/assets/fixtures/teaser/teasers.inc.json +4 -0
- package/src/stories/views/components/base/link.hbs +5 -10
- package/src/stories/views/components/base/link.mdx +57 -0
- package/src/stories/views/components/base/link.stories.js +61 -0
- package/src/stories/views/components/button/button.mdx +2 -2
- package/src/stories/views/components/button/link_button.hbs +2 -2
- package/src/stories/views/components/button/link_button.stories.js +10 -0
- package/src/stories/views/components/content_nav/content_nav_item.hbs +17 -21
- package/src/stories/views/components/event/calendar/event_calendar_event_teaser.hbs +4 -4
- package/src/stories/views/components/event/calendar/event_calendar_footer.hbs +2 -3
- package/src/stories/views/components/event/event_ticket_button.hbs +2 -2
- package/src/stories/views/components/page/fixtures/page_pagination.json +1 -1
- package/src/stories/views/components/site_header/navigation_flyout/navigation_flyout_item.hbs +9 -4
- package/src/stories/views/components/site_header/section_navigation/section_navigation_top_topics.hbs +2 -3
- package/src/stories/views/components/teaser/cluster/teaser_cluster.hbs +1 -1
- package/src/stories/views/components/teaser/cluster/teaser_cluster_item.hbs +7 -7
- package/src/stories/views/components/teaser/components/teaser_body.hbs +26 -19
- package/src/stories/views/components/teaser/components/teaser_comments.hbs +2 -2
- package/src/stories/views/components/teaser/components/teaser_image.hbs +1 -1
- package/src/stories/views/components/teaser/components/teaser_lead.hbs +1 -1
- package/src/stories/views/components/teaser/components/teaser_text.hbs +2 -2
- package/src/stories/views/components/teaser/components/teaser_ticker_body.hbs +3 -4
- package/src/stories/views/components/teaser/fixtures/teaser_alternative_100_serif_download.json +1 -1
- package/src/stories/views/components/teaser/fixtures/teaser_alternative_50_serif_download.json +1 -1
- package/src/stories/views/components/teaser/fixtures/teaser_standard_100_serif_download.json +1 -1
- package/src/stories/views/components/teaser/fixtures/teaser_standard_50_serif_download.json +1 -1
- package/src/stories/views/components/teaser/podcast/podcast_item_title.hbs +5 -7
- package/src/stories/views/components/teaser/podcast/podcast_player_ui.hbs +1 -2
- package/src/stories/views/components/teaser/podcast/podcast_playlist_player.hbs +3 -5
- package/src/stories/views/components/teaser/podcast/podcast_title.hbs +3 -3
- package/src/stories/views/components/teaser/stage/stage_text.hbs +2 -2
- package/src/stories/views/components/teaser/tabbox/group_tabbox.hbs +1 -1
- package/src/stories/views/components/teaser/teaser_poster.hbs +3 -3
- package/src/stories/views/components/teaser/ticker/teaser_ticker.hbs +1 -1
- package/src/stories/views/components/tracking/download_tracking.hbs +2 -0
- package/src/stories/views/components/tracking/navigation_tracking.hbs +4 -0
- package/dist/views/components/base/link_open.hbs +0 -12
- package/dist/views/components/base/link_v2.hbs +0 -14
- package/src/stories/views/components/base/link_open.hbs +0 -12
- package/src/stories/views/components/base/link_v2.hbs +0 -14
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,28 @@
|
|
|
1
|
+
# v1.16.1 (Wed May 03 2023)
|
|
2
|
+
|
|
3
|
+
#### 🐛 Bug Fix
|
|
4
|
+
|
|
5
|
+
- removes addClassImg statement [#621](https://github.com/mumprod/hr-design-system-handlebars/pull/621) (saad.elbaciri@hr.de [@selbaciri](https://github.com/selbaciri))
|
|
6
|
+
|
|
7
|
+
#### Authors: 2
|
|
8
|
+
|
|
9
|
+
- Saad El Baciri ([@selbaciri](https://github.com/selbaciri))
|
|
10
|
+
- selbaciri (saad.elbaciri@hr.de)
|
|
11
|
+
|
|
12
|
+
---
|
|
13
|
+
|
|
14
|
+
# v1.16.0 (Wed May 03 2023)
|
|
15
|
+
|
|
16
|
+
#### 🚀 Enhancement
|
|
17
|
+
|
|
18
|
+
- Feature/dpe 2284 [#620](https://github.com/mumprod/hr-design-system-handlebars/pull/620) ([@szuelch](https://github.com/szuelch))
|
|
19
|
+
|
|
20
|
+
#### Authors: 1
|
|
21
|
+
|
|
22
|
+
- [@szuelch](https://github.com/szuelch)
|
|
23
|
+
|
|
24
|
+
---
|
|
25
|
+
|
|
1
26
|
# v1.15.0 (Tue May 02 2023)
|
|
2
27
|
|
|
3
28
|
#### 🚀 Enhancement
|
package/dist/assets/index.css
CHANGED
|
@@ -2677,7 +2677,7 @@ video {
|
|
|
2677
2677
|
transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
|
|
2678
2678
|
}
|
|
2679
2679
|
.counter-reset {
|
|
2680
|
-
counter-reset:
|
|
2680
|
+
counter-reset: cnt1683113748894;
|
|
2681
2681
|
}
|
|
2682
2682
|
.hyphens-auto {
|
|
2683
2683
|
-webkit-hyphens: auto;
|
|
@@ -2915,7 +2915,7 @@ video {
|
|
|
2915
2915
|
--tw-ring-color: rgba(255, 255, 255, 0.5);
|
|
2916
2916
|
}
|
|
2917
2917
|
.-ordered {
|
|
2918
|
-
counter-increment:
|
|
2918
|
+
counter-increment: cnt1683113748894 1;
|
|
2919
2919
|
}
|
|
2920
2920
|
.-ordered::before {
|
|
2921
2921
|
position: absolute;
|
|
@@ -2931,7 +2931,7 @@ video {
|
|
|
2931
2931
|
letter-spacing: .0125em;
|
|
2932
2932
|
--tw-text-opacity: 1;
|
|
2933
2933
|
color: rgba(0, 0, 0, var(--tw-text-opacity));
|
|
2934
|
-
content: counter(
|
|
2934
|
+
content: counter(cnt1683113748894);
|
|
2935
2935
|
}
|
|
2936
2936
|
/*! ****************************/
|
|
2937
2937
|
/*! text-shadow */
|
|
@@ -1,13 +1,8 @@
|
|
|
1
|
-
<a {{#with
|
|
2
|
-
class="sb-link ds-link js-load{{#if
|
|
3
|
-
{{#if
|
|
4
|
-
data-hr-click-tracking='{"settings": [{"type":"uxAction","secondLevelId": "1","clickLabel":"{{_clickLabelType}}{{#if _clickLabelPrefix1}}::{{_clickLabelPrefix1}}{{/if}}::{{_clickLabelPrefix2}}-Link geklickt"}]}'
|
|
5
|
-
{{/if}}
|
|
6
|
-
{{#if this.isFileDownload}}
|
|
7
|
-
{{#with this.trackingData}}data-hr-click-tracking='{"settings": [{"type":"download","secondLevelId": "{{this.link.secondLevelId}}","clickLabel": "{{this.link.pageName}}"}]}'{{/with}}
|
|
8
|
-
{{/if}}
|
|
9
|
-
{{#if this.link.isTargetBlank}} target="_blank" rel="noopener{{#if this.link.hasNoReferrerFlag}} noreferrer{{/if}}"{{/if}}
|
|
1
|
+
<a {{#with _link.webviewUrl}}data-webviewurl="{{this}}"{{/with}} href="{{_link.url}}{{#if this.hasComments}}#commentList{{/if}}"
|
|
2
|
+
class="sb-link ds-link js-load {{#if _isSelected}} {{defaultIfEmpty _selectedCssClass "-current"}}{{/if}}{{#if _css}} {{_css}}{{/if}} {{#> css}}{{/css}}"
|
|
3
|
+
{{#if _link.isTargetBlank}} target="_blank" rel="noopener{{#if _link.hasNoReferrerFlag}} noreferrer{{/if}}"{{/if}}
|
|
10
4
|
{{#if _isAriaHidden}} aria-hidden="true" tabindex="-1"{{/if}}
|
|
5
|
+
{{#> htmlProperties}}{{/htmlProperties}}
|
|
11
6
|
>
|
|
12
|
-
{{
|
|
7
|
+
{{> @partial-block }}
|
|
13
8
|
</a>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
{{#> components/base/
|
|
1
|
+
{{#> components/base/link _link=_link _css=_css _isAriaHidden=_isAriaHidden}}
|
|
2
2
|
{{> @partial-block }}
|
|
3
|
-
{{/components/base/
|
|
3
|
+
{{/components/base/link}}
|
|
4
4
|
{{#*inline "css"~}}
|
|
5
5
|
{{> components/button/utilities/button_base_classes}} {{> components/button/utilities/button_variation_classes _variant=../../_variant _onBackground=../../_onBackground}} {{> components/button/utilities/button_dimension_classes _size=../../_size~}}
|
|
6
6
|
{{~/inline}}
|
|
@@ -6,25 +6,21 @@
|
|
|
6
6
|
{{~#if _isflow}} content-nav-item-flow{{/if~}}
|
|
7
7
|
{{~#if this.isSelected}} font-bold -current{{/if~}}
|
|
8
8
|
">
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
{{>components/base/image/icon _icon="arrow-right" _addClass="fill-current pb-0.5 h-4 w-4 ml-2 inline" }}
|
|
27
|
-
</span>
|
|
28
|
-
|
|
29
|
-
{{/decorator}}
|
|
9
|
+
{{#with this}}
|
|
10
|
+
{{#> components/base/link _link=this.link _isSelected=this.isSelected _css="flex items-center pt-2.5 px-2 whitespace-nowrap overflow-hidden" _selectedCssClass="is-selected"}}
|
|
11
|
+
<span class="block text-base leading-4 grow font-copy js-title truncate">
|
|
12
|
+
{{~this.title~}}
|
|
13
|
+
{{~#if this.link.hasIcon~}}
|
|
14
|
+
{{> components/base/image/icon _icon=this.link.iconName _addClass="ml-2 -mt-0.5 h-4 w-4 inline" _iconmap="icons"}}
|
|
15
|
+
{{~/if~}}
|
|
16
|
+
</span>
|
|
17
|
+
|
|
18
|
+
<span>
|
|
19
|
+
{{>components/base/image/icon _icon="arrow-right" _addClass="fill-current pb-0.5 h-4 w-4 ml-2 inline" }}
|
|
20
|
+
</span>
|
|
21
|
+
{{/components/base/link}}
|
|
22
|
+
{{#*inline "htmlProperties"}}
|
|
23
|
+
{{> components/tracking/navigation_tracking _clickLabelType="Contentnavigation" _clickLabelPrefix1=this.title}}
|
|
24
|
+
{{/inline}}
|
|
25
|
+
{{/with}}
|
|
30
26
|
</li>
|
|
@@ -13,8 +13,8 @@
|
|
|
13
13
|
<div class="flex flex-col items-start basis-10/12 w-10/12">
|
|
14
14
|
<div class="absolute top-0 left-0 w-full sm:static">
|
|
15
15
|
<div class="ar-4-3 sm:ar-auto">
|
|
16
|
-
{{#> components/teaser/components/teaser_header _css="absolute bottom-0 left-0 p-4 w-full sm:pt-3 sm:pb-2 bg-white opacity-80 sm:static sm:bg-transparent"}}
|
|
17
|
-
{{
|
|
16
|
+
{{#> components/teaser/components/teaser_header _link=this.link _css="absolute bottom-0 left-0 p-4 w-full sm:pt-3 sm:pb-2 bg-white opacity-80 sm:static sm:bg-transparent"}}
|
|
17
|
+
{{#> components/base/link _css="ds-teaser-focus hover:text-toplineColor" }}
|
|
18
18
|
{{#with this.label}}
|
|
19
19
|
{{#> components/label/label_group}}
|
|
20
20
|
{{> components/label/label _type=this.type _text=(loca this.loca) _css="mr-2"}}
|
|
@@ -23,14 +23,14 @@
|
|
|
23
23
|
{{/if}}
|
|
24
24
|
{{/components/label/label_group}}
|
|
25
25
|
{{/with~}}
|
|
26
|
-
{{#> components/teaser/components/teaser_headline _headlineTag="h3"}}
|
|
26
|
+
{{#> components/teaser/components/teaser_headline _css="" _headlineTag="h3"}}
|
|
27
27
|
{{#if this.topline}}
|
|
28
28
|
{{> components/teaser/components/teaser_topline _text=this.topline}}
|
|
29
29
|
{{/if}}
|
|
30
30
|
{{> components/teaser/components/teaser_title _text=this.title _css="text-2xl"}}
|
|
31
31
|
{{> components/event/event_tags this.eventtags}}
|
|
32
32
|
{{/components/teaser/components/teaser_headline}}
|
|
33
|
-
{{/
|
|
33
|
+
{{/components/base/link }}
|
|
34
34
|
{{/components/teaser/components/teaser_header}}
|
|
35
35
|
</div>
|
|
36
36
|
</div>
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
<footer class='bg-event-calendar-primary text-center'>
|
|
2
|
-
{{
|
|
3
|
-
'components/base/link'
|
|
2
|
+
{{#> components/base/link _link=this.link
|
|
4
3
|
_css='block p-2 text-white text-sm font-serif hover:underline underline-offset-3'
|
|
5
4
|
}}
|
|
6
5
|
{{loca 'event_calendar_monthly_overview_link'}}
|
|
7
|
-
{{/
|
|
6
|
+
{{/components/base/link}}
|
|
8
7
|
</footer>
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
{{#> components/button/button _size="lg" _variant="tertiary" _value="cancel" _css="mr-4 mt-4"}}
|
|
14
14
|
{{>components/button/components/button_label _label="Abbrechen" _css=""}}
|
|
15
15
|
{{/components/button/button}}
|
|
16
|
-
{{#> components/button/link_button _size="lg" _css="js-ticket-ok-button js-modal-close mt-4"}}
|
|
16
|
+
{{#> components/button/link_button _link=this.link _size="lg" _css="js-ticket-ok-button js-modal-close mt-4"}}
|
|
17
17
|
{{>components/button/components/button_label _label="Zum Ticketshop" _css=""}}
|
|
18
18
|
{{/components/button/link_button}}
|
|
19
19
|
</div>
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
display:none;
|
|
25
25
|
}
|
|
26
26
|
</style>
|
|
27
|
-
{{#> components/button/link_button _size="lg"}}
|
|
27
|
+
{{#> components/button/link_button _link=this.link _size="lg"}}
|
|
28
28
|
{{> components/button/components/button_icon _icon="ticket" _iconmap="icons"}}
|
|
29
29
|
{{>components/button/components/button_label _label="Tickets"}}
|
|
30
30
|
{{/components/button/link_button}}
|
|
@@ -1,7 +1,12 @@
|
|
|
1
1
|
<li :class="dropped ? 'h-auto' : 'h-10'"
|
|
2
2
|
class="sb-navigation-flyout-item pl-4 {{#if _flyout}}lg:px-0 {{else}}lg:px-2 lg:first-of-type:pl-0 {{/if}}{{#if _parentselected}}lg:whitespace-nowrap{{/if}} flex h-auto text-base leading-6 border-b border-gray-200 lg:last:border-0 lg:border-0 text-blue-congress justify-start hover:underline">
|
|
3
|
-
{{#
|
|
4
|
-
{{this.
|
|
5
|
-
|
|
6
|
-
|
|
3
|
+
{{#with this}}
|
|
4
|
+
{{#> components/base/link _link=this.link _css=(inline-switch _fromNav '["RubrikNavigation","ServiceNavigation"]' '["link-focus-inset py-2 w-full","link-focus py-2 md:pl-0 lg:pl-0 lg:pr-0 break-words w-full"]') }}
|
|
5
|
+
{{this.text}}
|
|
6
|
+
{{~#if this.link.hasIcon}}{{> components/base/image/icon _icon=this.link.iconName _addClass="w-4 h-4 fill-current ml-2 inline-flex" _iconmap="icons" }} {{/if}}
|
|
7
|
+
{{/components/base/link}}
|
|
8
|
+
{{#*inline "htmlProperties"}}
|
|
9
|
+
{{> components/tracking/navigation_tracking _clickLabelType=../../_fromNav _clickLabelPrefix1=../../_parent clickLabelPrefix2=this.link.content.text}}
|
|
10
|
+
{{/inline}}
|
|
11
|
+
{{/with}}
|
|
7
12
|
</li>
|
package/dist/views/components/site_header/section_navigation/section_navigation_top_topics.hbs
CHANGED
|
@@ -2,10 +2,9 @@
|
|
|
2
2
|
<ul class="flex flex-row items-center w-full p-4 text-left list-none bg-white lg:pb-1 lg:p-0 lg:bg-transparent lg:h-10">
|
|
3
3
|
{{#each this.items}}
|
|
4
4
|
<li class="{{#unless @last}}mr-3 {{/unless}}{{#if this.selected}}bg-blue-200 hover:bg-blue-300 text-blue-astronautBlue{{else}}bg-white hover:bg-grey-alto text-blue-congress{{/if}} rounded px-2 pt-px inline-block w-auto tracking-wide text-base leading-5.5 font-heading">
|
|
5
|
-
|
|
6
|
-
{{#decorator 'components/base/link'}}
|
|
5
|
+
{{#> components/base/link _link=this.link}}
|
|
7
6
|
{{this.text}}
|
|
8
|
-
{{/
|
|
7
|
+
{{/components/base/link}}
|
|
9
8
|
</li>
|
|
10
9
|
{{/each}}
|
|
11
10
|
</ul>
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
{{~#with this.overviewLink}}
|
|
17
17
|
{{~#if this.link~}}
|
|
18
18
|
<div class="flex mx-5 pb-9 pt-6 min-w-0 {{~inline-switch ../this.realTeaserSize '["100"]' '[" justify-center md:justify-end"," justify-center"]'}}">
|
|
19
|
-
{{~#> components/button/link_button _variant="secondary" _size="lg" _css="overflow-hidden"}}
|
|
19
|
+
{{~#> components/button/link_button _link=this.link _variant="secondary" _size="lg" _css="overflow-hidden"}}
|
|
20
20
|
{{>components/button/components/button_label _label=this.title _css="flex-1 truncate"}}
|
|
21
21
|
{{> components/button/components/button_icon _icon="arrow-right" _iconmap="icons" _css=""}}
|
|
22
22
|
{{/components/button/link_button}}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
{{
|
|
2
|
-
{{#
|
|
3
|
-
{{#> components/label/label_group _css=(if
|
|
4
|
-
{{> components/label/label _type=this.type _text=(loca this.loca) _css=""}}
|
|
1
|
+
{{#>components/base/link _link=this.link _css=(appendToDefault (if _firstItem "ds-teaser-focus") "block group") }}
|
|
2
|
+
{{#if this.label}}
|
|
3
|
+
{{#> components/label/label_group _css=(if ../../_ordered "pl-8")}}
|
|
4
|
+
{{> components/label/label _type=this.label.type _text=(loca this.label.loca) _css=""}}
|
|
5
5
|
{{> components/label/label_byline _css="ml-2"}}
|
|
6
6
|
{{/components/label/label_group}}
|
|
7
|
-
{{/
|
|
8
|
-
{{#> components/teaser/components/teaser_headline _headlineTag="h3"}}
|
|
7
|
+
{{/if~}}
|
|
8
|
+
{{#> components/teaser/components/teaser_headline _css="" _headlineTag="h3"}}
|
|
9
9
|
{{> components/teaser/components/teaser_title _css=(appendToDefault (if ../../_ordered " pl-8") "group-hover:underline text-clusterTeaserLink") _text=this.title _size=../../_size _teaserType="cluster" _firstItem=../../_firstItem}}
|
|
10
10
|
{{/components/teaser/components/teaser_headline}}
|
|
11
|
-
{{/
|
|
11
|
+
{{/components/base/link}}
|
|
12
12
|
{{> components/teaser/cluster/teaser_cluster_byline _ordered=_ordered}}
|
|
@@ -2,25 +2,32 @@
|
|
|
2
2
|
{{~#if this.isMobile1to1}}:class="{'basis-full w-full md:pr-0 pr-10':avStart,'basis-3/5 w-3/5':!avStart}"{{/if}}>
|
|
3
3
|
|
|
4
4
|
|
|
5
|
-
{{
|
|
6
|
-
{{
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
5
|
+
{{#with this}}
|
|
6
|
+
{{#> components/teaser/components/teaser_header _link=this.link _css=(if this.isMobile1to1 "" "px-5 sm:px-0")}}
|
|
7
|
+
{{#> components/base/link _css="cy-teaser-link ds-teaser-focus hover:text-toplineColor" }}
|
|
8
|
+
{{#with this.label}}
|
|
9
|
+
{{#> components/label/label_group}}
|
|
10
|
+
{{> components/label/label _type=this.type _css="" _text=(loca this.loca)}}
|
|
11
|
+
{{> components/label/label_byline _css="ml-2"}}
|
|
12
|
+
{{/components/label/label_group}}
|
|
13
|
+
{{/with~}}
|
|
14
|
+
{{#> components/teaser/components/teaser_headline _headlineTag=this.headlineTag _css="overflow-anywhere hyphens-auto"}}
|
|
15
|
+
{{#if this.topline}}
|
|
16
|
+
{{> components/teaser/components/teaser_topline _css="" _text=this.topline}}
|
|
17
|
+
{{/if}}
|
|
18
|
+
{{> components/teaser/components/teaser_title _css="" _text=this.title _size=this.realTeaserSize _teaserType=this.teaserType _isMobile1to1=this.isMobile1to1}}
|
|
19
|
+
{{#if this.extendedTitle}}
|
|
20
|
+
{{> components/teaser/components/teaser_subline _text=this.extendedTitle}}
|
|
21
|
+
{{/if}}
|
|
22
|
+
{{/components/teaser/components/teaser_headline}}
|
|
23
|
+
{{/components/base/link}}
|
|
24
|
+
{{/components/teaser/components/teaser_header}}
|
|
25
|
+
{{#*inline "htmlProperties"}}
|
|
26
|
+
{{#if this.isFileDownload}}
|
|
27
|
+
{{> components/tracking/download_tracking}}
|
|
28
|
+
{{/if}}
|
|
29
|
+
{{/inline}}
|
|
30
|
+
{{/with}}
|
|
24
31
|
|
|
25
32
|
{{#unless this.hideBylineAndShorttext}}
|
|
26
33
|
<div class="sm:px-0{{#unless this.isMobile1to1}} px-5{{/unless}}">
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{{#with this.commentLink}}
|
|
2
2
|
<span class="relative whitespace-nowrap z-100">
|
|
3
|
-
{{
|
|
3
|
+
{{#> components/base/link _link=this.link _css="hover:underline decoration-1" _isAriaHidden=true}}
|
|
4
4
|
{{> components/base/image/icon _icon="kommentar" _iconmap="icons" _addClass="mr-0.5 inline w-5 h-5 text-toplineColor fill-current"}}
|
|
5
5
|
<span class="sr-only">{{loca "comment_anchor_1"}}</span>
|
|
6
6
|
<span class="text-toplineColor">{{../this.commentNumber}}</span>
|
|
@@ -10,6 +10,6 @@
|
|
|
10
10
|
<span class="text-toplineColor">{{loca "comment_label_text_many"}}</span>
|
|
11
11
|
{{/if}}
|
|
12
12
|
<span class="sr-only">{{loca "comment_anchor_2"}}</span>
|
|
13
|
-
{{/
|
|
13
|
+
{{/components/base/link}}
|
|
14
14
|
</span>
|
|
15
15
|
{{/with}}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
{{> components/geoTag/geoTag _text=this.[0].title _teaserSize=../_teaserSize _isMobile1to1=../_isMobile1to1 }}
|
|
4
4
|
{{/with~}}
|
|
5
5
|
{{/unless}}
|
|
6
|
-
{{~> components/base/image/responsive_image this.teaserImage _type=this.teaserType _variant=this.imageVariant _noDelay=this.dontLazyload _addClassImg=
|
|
6
|
+
{{~> components/base/image/responsive_image this.teaserImage _type=this.teaserType _variant=this.imageVariant _noDelay=this.dontLazyload _addClassImg=_addClassImg ~}}
|
|
7
7
|
{{#if this.isProgram}}
|
|
8
8
|
{{#if this.showMediatheksLink}}
|
|
9
9
|
{{#with this}}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{{~#if this.allowAVConsumption ~}}
|
|
2
2
|
{{> components/teaser/components/teaser_av_consumption _aspectRatio=_aspectRatio _isMobile1to1=_isMobile1to1 _teaserSize=_teaserSize _teaserType=_teaserType }}
|
|
3
3
|
{{else}}
|
|
4
|
-
{{> components/teaser/components/teaser_image _isMobile1to1=_isMobile1to1 _teaserSize=_teaserSize}}
|
|
4
|
+
{{> components/teaser/components/teaser_image _isMobile1to1=_isMobile1to1 _teaserSize=_teaserSize _addClassImg=_addClassImg}}
|
|
5
5
|
{{/if}}
|
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
{{~_text~}}
|
|
4
4
|
</span>
|
|
5
5
|
{{#if this.isExtOrBrandLink}}
|
|
6
|
-
{{
|
|
6
|
+
{{#>components/base/link _link=this.link _css="relative inline text-link z-20 ds-focus"}}
|
|
7
7
|
<span class="hover:underline decoration-1 font-copy">{{this.link.readMoreText.readMore}}{{~#if this.link.hasIcon}}{{> components/base/image/icon _icon=this.link.iconName _iconmap="icons" _addClass="inline -mt-0.5 w-5 h-5 fill-current ml-1"}}{{/if~}}</span>
|
|
8
|
-
{{/
|
|
8
|
+
{{/components/base/link}}
|
|
9
9
|
{{/if}}
|
|
10
10
|
</div>
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
|
|
4
4
|
|
|
5
5
|
{{#> components/teaser/components/teaser_header _css=(if this.isMobile1to1 "" "px-5 sm:px-0 mx-4 mb-5")}}
|
|
6
|
-
{{
|
|
6
|
+
{{#>components/base/link _link=this.link _css="cy-teaser-link ds-teaser-focus hover:text-toplineColor" }}
|
|
7
7
|
{{#with this.label}}
|
|
8
8
|
{{#> components/label/label_group}}
|
|
9
9
|
{{> components/label/label _type=this.type _text=(loca this.loca)}}
|
|
@@ -12,15 +12,14 @@
|
|
|
12
12
|
{{/with~}}
|
|
13
13
|
{{#> components/teaser/components/teaser_headline _headlineTag=this.headlineTag _css="overflow-anywhere hyphens-auto"}}
|
|
14
14
|
{{#if this.topline}}
|
|
15
|
-
|
|
16
|
-
{{> components/teaser/components/teaser_topline _text=this.topline}}
|
|
15
|
+
{{> components/teaser/components/teaser_topline _css="" _text=this.topline}}
|
|
17
16
|
{{/if}}
|
|
18
17
|
{{> components/teaser/components/teaser_title _css="!text-white" _text=this.title _size=this.realTeaserSize _teaserType=this.teaserType _isMobile1to1=this.isMobile1to1}}
|
|
19
18
|
{{#if this.extendedTitle}}
|
|
20
19
|
{{> components/teaser/components/teaser_subline _text=this.extendedTitle}}
|
|
21
20
|
{{/if}}
|
|
22
21
|
{{/components/teaser/components/teaser_headline}}
|
|
23
|
-
{{/
|
|
22
|
+
{{/components/base/link}}
|
|
24
23
|
{{/components/teaser/components/teaser_header}}
|
|
25
24
|
|
|
26
25
|
<div class="flex flex-wrap justify-between mx-4 my-5 text-base text-white justify-items-center">
|
|
@@ -1,11 +1,9 @@
|
|
|
1
|
-
{{
|
|
2
|
-
'
|
|
3
|
-
_css='w-full ds-link font-heading text-base text-podcast-text line-clamp-4 ...'
|
|
1
|
+
{{#>components/base/link _link=this.link
|
|
2
|
+
_css='w-full ds-link font-heading text-base text-podcast-text line-clamp-4'
|
|
4
3
|
}}
|
|
5
4
|
<span
|
|
6
|
-
class='block hover:underline text-podcast-text
|
|
7
|
-
{{~inline-switch _teaserSize '["100","50"]' '[" text-base"," text-base"]'~}}'
|
|
5
|
+
class='block hover:underline text-podcast-text text-base'
|
|
8
6
|
>
|
|
9
|
-
{{
|
|
7
|
+
{{~../../_title~}}
|
|
10
8
|
</span>
|
|
11
|
-
{{/
|
|
9
|
+
{{/components/base/link}}
|
|
@@ -65,17 +65,15 @@
|
|
|
65
65
|
ax-load
|
|
66
66
|
x-ignore
|
|
67
67
|
ax-load-src={{resourceUrl "assets/js/vendor/podcast_player.alpine.js" }}>
|
|
68
|
-
|
|
69
|
-
{{#each this}}
|
|
68
|
+
{{#each this.playlistItems}}
|
|
70
69
|
<div class="flex pb-5 {{#unless @last}}border-white border-b{{/unless}}">
|
|
71
70
|
{{> components/teaser/podcast/podcast_player_ui
|
|
72
71
|
_isPlaylistPlayer=true
|
|
73
|
-
_podcastDuration=duration
|
|
74
|
-
_title=title
|
|
72
|
+
_podcastDuration=this.duration
|
|
73
|
+
_title=this.title
|
|
75
74
|
_id=(nextRandom)
|
|
76
75
|
_first=@first
|
|
77
76
|
}}
|
|
78
77
|
</div>
|
|
79
78
|
{{/each}}
|
|
80
|
-
{{/with}}
|
|
81
79
|
</div>
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{{#if this.isSingleChannel}}
|
|
2
|
-
{{
|
|
3
|
-
<span class="mt-0.5 group-hover:underline {{#if _ordered}} pl-8 {{/if}}line-clamp-4 {{inline-switch _teaserSize '["hero","100","50"]''["text-base md:text-2xl lg:line-clamp-2","text-base md:text-2xl lg:line-clamp-2","text-base md:text-lg"]' ~}}">
|
|
2
|
+
{{#>components/base/link _link=this.link _css="group ds-link font-title text-base mt-2.5 text-podcast-text"}}
|
|
3
|
+
<span class="mt-0.5 group-hover:underline {{#if ../../_ordered}} pl-8 {{/if}}line-clamp-4 {{inline-switch ../../_teaserSize '["hero","100","50"]''["text-base md:text-2xl lg:line-clamp-2","text-base md:text-2xl lg:line-clamp-2","text-base md:text-lg"]' ~}}">
|
|
4
4
|
{{~_title~}}
|
|
5
5
|
</span>
|
|
6
|
-
{{/
|
|
6
|
+
{{/components/base/link}}
|
|
7
7
|
{{else}}
|
|
8
8
|
<div class="font-title text-base mt-2.5 text-podcast-text">
|
|
9
9
|
<span class="mt-0.5 {{#if _ordered}} pl-8 {{/if}}line-clamp-4 {{inline-switch _teaserSize '["hero","100","50"]''["text-base md:text-2xl lg:line-clamp-2","text-base md:text-2xl lg:line-clamp-2","text-base md:text-lg"]' ~}}">
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<div class="absolute left-2/4 right-auto bottom-15 lg:bottom-10 flex w-full px-5 sm:px-11.5 -translate-x-2/4 {{inline-switch this.stageTextPosition '["right50"]' '[" justify-end"," justify-start"]'}}">
|
|
2
2
|
<div class="relative p-4 rounded-2xl bg-stageTextBox/85 {{inline-switch this.stageTextPosition '["left100"]' '[" w-full"," max-w-xs sm:w-fit md:max-w-2/4"]'}} ">
|
|
3
|
-
{{
|
|
3
|
+
{{#>components/base/link _link=this.link _css="ds-teaser-focus before:rounded-2xl"}}
|
|
4
4
|
{{#> components/teaser/components/teaser_header}}
|
|
5
5
|
{{#with this.label}}
|
|
6
6
|
{{#> components/label/label_group _css="!text-stageText"}}
|
|
@@ -37,6 +37,6 @@
|
|
|
37
37
|
{{> components/base/image/icon _icon=this.link.iconName _iconmap="icons" _addClass="inline w-5 h-5 self-baseline fill-current ml-1" }}]
|
|
38
38
|
</span>
|
|
39
39
|
{{/if}}
|
|
40
|
-
{{/
|
|
40
|
+
{{/components/base/link}}
|
|
41
41
|
</div>
|
|
42
42
|
</div>
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
</div>
|
|
8
8
|
{{~#if this.link~}}
|
|
9
9
|
<div class="flex justify-center min-w-0 pt-8 mx-5">
|
|
10
|
-
{{~#> components/button/link_button _variant="secondary" _size="lg" _css="overflow-hidden"}}
|
|
10
|
+
{{~#> components/button/link_button _link=this.link _variant="secondary" _size="lg" _css="overflow-hidden"}}
|
|
11
11
|
{{>components/button/components/button_label _label=(loca "group_tabbed_more" this.title) _css="flex-1 truncate mr-2"}}
|
|
12
12
|
{{> components/button/components/button_icon _icon="arrow-right" _iconmap="icons" _css=""}}
|
|
13
13
|
{{/components/button/link_button}}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
{{~> components/base/image/responsive_image this.teaserImage _type=this.teaserType _variant=this.content.imageVariant _noDelay=../_noDelay _addClassImg="ar__content rounded-tl-hr rounded-br-hr" ~}}
|
|
4
4
|
</figure>
|
|
5
5
|
<div class="absolute flex flex-col justify-center w-full h-full bg-gradient-to-t from-black rounded-tl-hr rounded-br-hr">
|
|
6
|
-
{{
|
|
6
|
+
{{#>components/base/link _link=this.link _css="ds-teaser-focus flex items-center flex-col before:rounded-tl-hr before:rounded-br-hr hover:text-toplineColor"}}
|
|
7
7
|
{{#> components/teaser/components/teaser_header}}
|
|
8
8
|
{{#with this.label}}
|
|
9
9
|
{{#> components/label/label_group}}
|
|
@@ -21,9 +21,9 @@
|
|
|
21
21
|
{{/if}}
|
|
22
22
|
{{/components/teaser/components/teaser_headline}}
|
|
23
23
|
{{/components/teaser/components/teaser_header}}
|
|
24
|
-
{{/
|
|
24
|
+
{{/components/base/link}}
|
|
25
25
|
<span class="absolute flex w-full h-full items-end justify-center ds-cta">
|
|
26
|
-
{{#> components/button/link_button _size="lg" _css=(inline-switch this.realTeaserSize '["33","50"]' '["z-20 mb-7","z-20 mb-7 md:mb-16"]') _variant="secondary" _isAriaHidden=true _onBackground=true}}
|
|
26
|
+
{{#> components/button/link_button _link=this.link _size="lg" _css=(inline-switch this.realTeaserSize '["33","50"]' '["z-20 mb-7","z-20 mb-7 md:mb-16"]') _variant="secondary" _isAriaHidden=true _onBackground=true}}
|
|
27
27
|
{{> components/button/components/button_label _css="" _label=this.link.readMoreText.readMoreLong}}
|
|
28
28
|
{{/components/button/link_button}}
|
|
29
29
|
</span>
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
<figure class="{{> components/teaser/utilities/teaser_image_cypress_hook_classes}}relative
|
|
12
12
|
{{~#if this.isMobile1to1}} basis-2/5 w-2/5 ar-1-1 md:basis-full md:w-full md:ar-16-9{{else}} ar-16-9 w-full{{/if~}}"
|
|
13
13
|
{{~#if this.isMobile1to1}} :class="{'ar-16-9 w-full basis-full': avStart,'ar-1-1 basis-2/5 w-2/5':!avStart}"{{/if}} >
|
|
14
|
-
{{> components/teaser/components/teaser_lead _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _teaserType=this.teaserType _aspectRatio=(if this.isMobile1to1 'ar-1-1 md:ar-16-9' (inline-switch this.teaserSize '["25"]' '["ar-1-1 md:ar-16-9", "ar-16-9"]')) }}
|
|
14
|
+
{{> components/teaser/components/teaser_lead _addClassImg="rounded-tl-hr" _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _teaserType=this.teaserType _aspectRatio=(if this.isMobile1to1 'ar-1-1 md:ar-16-9' (inline-switch this.teaserSize '["25"]' '["ar-1-1 md:ar-16-9", "ar-16-9"]')) }}
|
|
15
15
|
</figure>
|
|
16
16
|
{{#if this.displayTeaserBodyAsImageOverlay}}
|
|
17
17
|
{{#decorator 'components/teaser/components/teaser_image_overlay' _noOverlayInMobileViewports=true _cssClasses=" relative md:absolute w-full bottom-0"}}
|
package/package.json
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"main": "dist/index.js",
|
|
8
8
|
"repository": "https://github.com/szuelch/hr-design-system-handlebars",
|
|
9
|
-
"version": "1.
|
|
9
|
+
"version": "1.16.1",
|
|
10
10
|
"scripts": {
|
|
11
11
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
12
12
|
"storybook": "storybook dev -p 6006 public",
|
|
@@ -1123,6 +1123,10 @@
|
|
|
1123
1123
|
"hideGeotag": false,
|
|
1124
1124
|
"hideEditableByline": true,
|
|
1125
1125
|
"doTracking": true,
|
|
1126
|
+
"trackingData": {
|
|
1127
|
+
"secondLevelId": "2",
|
|
1128
|
+
"pageName": "download"
|
|
1129
|
+
},
|
|
1126
1130
|
"trackingForArdMediatheksLink": false,
|
|
1127
1131
|
"showMediatheksLink": false,
|
|
1128
1132
|
"showAirdate": false,
|
|
@@ -1,13 +1,8 @@
|
|
|
1
|
-
<a {{#with
|
|
2
|
-
class="sb-link ds-link js-load{{#if
|
|
3
|
-
{{#if
|
|
4
|
-
data-hr-click-tracking='{"settings": [{"type":"uxAction","secondLevelId": "1","clickLabel":"{{_clickLabelType}}{{#if _clickLabelPrefix1}}::{{_clickLabelPrefix1}}{{/if}}::{{_clickLabelPrefix2}}-Link geklickt"}]}'
|
|
5
|
-
{{/if}}
|
|
6
|
-
{{#if this.isFileDownload}}
|
|
7
|
-
{{#with this.trackingData}}data-hr-click-tracking='{"settings": [{"type":"download","secondLevelId": "{{this.link.secondLevelId}}","clickLabel": "{{this.link.pageName}}"}]}'{{/with}}
|
|
8
|
-
{{/if}}
|
|
9
|
-
{{#if this.link.isTargetBlank}} target="_blank" rel="noopener{{#if this.link.hasNoReferrerFlag}} noreferrer{{/if}}"{{/if}}
|
|
1
|
+
<a {{#with _link.webviewUrl}}data-webviewurl="{{this}}"{{/with}} href="{{_link.url}}{{#if this.hasComments}}#commentList{{/if}}"
|
|
2
|
+
class="sb-link ds-link js-load {{#if _isSelected}} {{defaultIfEmpty _selectedCssClass "-current"}}{{/if}}{{#if _css}} {{_css}}{{/if}} {{#> css}}{{/css}}"
|
|
3
|
+
{{#if _link.isTargetBlank}} target="_blank" rel="noopener{{#if _link.hasNoReferrerFlag}} noreferrer{{/if}}"{{/if}}
|
|
10
4
|
{{#if _isAriaHidden}} aria-hidden="true" tabindex="-1"{{/if}}
|
|
5
|
+
{{#> htmlProperties}}{{/htmlProperties}}
|
|
11
6
|
>
|
|
12
|
-
{{
|
|
7
|
+
{{> @partial-block }}
|
|
13
8
|
</a>
|