hr-design-system-handlebars 1.1.7 → 1.1.9

package/dist/views/components/event/calendar/event_calendar_event_teaser.hbs

@@ -13,12 +13,11 @@
                     <div class="flex flex-col items-start basis-10/12 w-10/12">
                         <div class="absolute top-0 left-0 w-full sm:static">
                             <div class="ar-4-3 sm:ar-auto">
-                                <header class="absolute bottom-0 left-0 p-4 w-full sm:pt-3 sm:pb-2 bg-white opacity-80 sm:static sm:bg-transparent">
+                                {{#> 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"}}
                                     {{#decorator 'components/base/link' _css="ds-teaser-focus hover:text-toplineColor" }} 
-                                        {{#> components/teaser/components/teaser_header}}
                                             {{#with this.label}}
                                                 {{#> components/label/label_group}}
-                                                    {{> components/label/label_test _type=this.type _text=(loca this.loca) _css="mr-2"}}
+                                                    {{> components/label/label _type=this.type _text=(loca this.loca) _css="mr-2"}}
                                                     {{#if ../this.hasStatus}}
                                                         {{> components/event/event_status _status=(loca ../this.statusDescriptionForLabelShort)}} 
                                                     {{/if}}
@@ -28,12 +27,11 @@
                                                 {{#if this.topline}}
                                                     {{> components/teaser/components/teaser_topline _text=this.topline}}
                                                 {{/if}}
-                                                {{> components/teaser/components/teaser_title_test _text=this.title _css="text-2xl"}}
+                                                {{> components/teaser/components/teaser_title _text=this.title _css="text-2xl"}}
                                                 {{> components/event/event_tags this.eventtags}} 
                                             {{/components/teaser/components/teaser_headline}}
-                                        {{/components/teaser/components/teaser_header}} 
                                     {{/decorator}}
-                                </header>
+                                {{/components/teaser/components/teaser_header}} 
                             </div>
                         </div>
                         {{> components/event/event_details this}}

package/dist/views/components/event/event_tag.hbs

@@ -1,3 +1,3 @@
 <span
-    class='block text-subline font-normal font-heading text-base sm:text-xl mt-0.5'
+    class="block text-subline font-normal font-heading text-base sm:text-xl mt-0.5{{#if _css}} {{_css}}{{/if}}"
 >{{_title}}</span>

package/dist/views/components/event/event_tags.hbs

@@ -1,11 +1,11 @@
-{{#with this}}
-    {{#with this.series}}
-        {{> components/event/event_tag _title=this.title}}
-    {{/with}}
-    {{#with this.project}}
-        {{> components/event/event_tag _title=this.title}}
-    {{/with}}
-    {{#with this.externalProject}}
-        {{> components/event/event_tag _title=this}}
-    {{/with}}
+
+{{#with this.series}}
+    {{> components/event/event_tag _css=../_css _title=this.title}}
 {{/with}}
+{{#with this.project}}
+    {{> components/event/event_tag _css=../_css _title=this.title}}
+{{/with}}
+{{#with this.externalProject}}
+    {{> components/event/event_tag _css=../_css _title=this}}
+{{/with}}
+

package/dist/views/components/event/event_ticket_button.hbs

@@ -5,7 +5,7 @@
     {{/components/button/button_v2}}
     {{#> components/modal/modal _trigger=(getRandom)}}
         {{#> components/teaser/components/teaser_headline}}
-            {{> components/teaser/components/teaser_title_test _text=(loca 'ticket_modal_headline') _css="text-2xl"}}
+            {{> components/teaser/components/teaser_title _text=(loca 'ticket_modal_headline') _css="text-2xl"}}
         {{/components/teaser/components/teaser_headline}}
         <p class="text-base font-copy mt-2">{{loca "ticket_modal_text"}}</p>
 

package/dist/views/components/event/label_byline.ssi.hbs

@@ -0,0 +1,9 @@
+{{#with this.firstInstant}}
+    {{#if this.hasStatus}}
+        {{> components/event/event_status _css="ml-2" _status=(loca this.statusDescriptionForLabelShort)}} 
+    {{else}}
+        {{#> components/text/byline _css="ml-2"}}
+            {{this.startDateTime.date}}, {{this.startDateTime.time}} Uhr
+        {{/components/text/byline}}
+    {{/if}}
+{{/with}}

package/dist/views/components/label/label.hbs

@@ -1,20 +1,11 @@
 <span
-    class='sb-label rounded px-1.5 pt-px inline-block tracking-wide text-white text-base leading-5.5 font-heading
+    class='sb-label rounded px-1.5 pt-px inline-block tracking-wide text-white text-base leading-5.5 font-heading{{#if _css}} {{_css}}{{/if}} 
         {{inline-switch
             _type
-            '["media","event","breakingnews","comment","analysis","der-tag-in-hessen","glosse","fragen-und-antworten","infografik","interaktiv","program","download","pm","liveticker","ticker","livestream","live","livechat","buliticker","social-tv","blog","podcast","kurzmeldung","location","topic"]'
-            '["bg-labelMedia","bg-labelEvent","bg-labelBreakingnews","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelInfografik","bg-labelInfografik","bg-labelProgram","bg-labelDownload","bg-labelPm","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelMedia","bg-labelKurzmeldung","bg-labelEvent","bg-labelComment"]'
+            '["media","event","breakingnews","comment","analysis","der-tag-in-hessen","glosse","fragen-und-antworten","infografik","interaktiv","program","download","pm","liveticker","ticker","livestream","live","livechat","buliticker","social-tv","blog","podcast","kurzmeldung"]'
+            '["bg-labelMedia","bg-labelEvent","bg-labelBreakingnews","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelInfografik","bg-labelInfografik","bg-labelProgram","bg-labelDownload","bg-labelPm","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelMedia","bg-labelKurzmeldung"]'
         }}'
 >
     {{_text}}
 
-</span>
-{{~#with this.byline~}}
-    <span class='ml-2 text-xs font-headingSerif {{#if ../_bylineCss}}{{../_bylineCss}}{{else}}text-grey-scorpion{{/if}}'>
-        {{~#if this.bylineSsi~}}
-            {{{this.bylineSsi}}}
-        {{~else~}}
-            {{this.bylineText}}
-        {{~/if~}}
-    </span>
-{{~/with~}}
+</span>

package/dist/views/components/label/label_byline.hbs

@@ -1,7 +1,10 @@
-<span class='ml-2 text-xs font-headingSerif{{#if _css}} {{../_css}}{{/if}}'>
+{{#with this.byline}}
     {{~#if this.bylineSsi~}}
-        {{{this.bylineSsi}}}
+        {{> components/base/loadSSI _context=this.context _templatePath=this.bylineSsi}}
     {{~else~}}
-        {{this.bylineText}}
+        {{#> components/text/byline _css=../_css}}
+            {{this.bylineText}}
+        {{/components/text/byline}}
     {{~/if~}}
-</span>
+{{/with}}
+ 

package/dist/views/components/label/label_group.hbs

@@ -1,3 +1,3 @@
-<div class="leading-5.5{{#if ../_css}} {{_css}}{{/if}}">
+<div class="leading-5.5 text-byline{{#if _css}} {{_css}}{{/if}}">
     {{> @partial-block }}
 </div>

package/dist/views/components/label/{label_test.hbs → label_old.hbs}

@@ -1,11 +1,20 @@
 <span
-    class='sb-label rounded px-1.5 pt-px inline-block tracking-wide text-white text-base leading-5.5 font-heading{{#if _css}} {{_css}}{{/if}} 
+    class='sb-label rounded px-1.5 pt-px inline-block tracking-wide text-white text-base leading-5.5 font-heading
         {{inline-switch
             _type
-            '["media","event","breakingnews","comment","analysis","der-tag-in-hessen","glosse","fragen-und-antworten","infografik","interaktiv","program","download","pm","liveticker","ticker","livestream","live","livechat","buliticker","social-tv","blog","podcast","kurzmeldung"]'
-            '["bg-labelMedia","bg-labelEvent","bg-labelBreakingnews","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelInfografik","bg-labelInfografik","bg-labelProgram","bg-labelDownload","bg-labelPm","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelMedia","bg-labelKurzmeldung"]'
+            '["media","event","breakingnews","comment","analysis","der-tag-in-hessen","glosse","fragen-und-antworten","infografik","interaktiv","program","download","pm","liveticker","ticker","livestream","live","livechat","buliticker","social-tv","blog","podcast","kurzmeldung","location","topic"]'
+            '["bg-labelMedia","bg-labelEvent","bg-labelBreakingnews","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelComment","bg-labelInfografik","bg-labelInfografik","bg-labelProgram","bg-labelDownload","bg-labelPm","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelLive","bg-labelMedia","bg-labelKurzmeldung","bg-labelEvent","bg-labelComment"]'
         }}'
 >
     {{_text}}
 
-</span>
+</span>
+{{~#with this.byline~}}
+    <span class='ml-2 text-xs font-headingSerif {{#if ../_bylineCss}}{{../_bylineCss}}{{else}}text-grey-scorpion{{/if}}'>
+        {{~#if this.bylineSsi~}}
+            {{> components/base/loadSSI _context=this.context _templatePath=this.bylineSsi}}
+        {{~else~}}
+            {{this.bylineText}}
+        {{~/if~}}
+    </span>
+{{~/with~}}

package/dist/views/components/multimedia/livestream/label_byline.ssi.hbs

@@ -0,0 +1,19 @@
+{{#with this.labelInfo}}
+    {{#> components/text/byline _css="ml-2"}}
+        {{~#if this.isPlaysNow ~}} {{loca "livestream_plays"}} {{/if~}}
+        {{~#if this.isHasPlayed ~}} {{loca "livestream_has_played"}} {{/if~}}
+        {{~#if this.isWillPlay ~}}
+            {{~#with ../../airdateDate ~}}
+                {{~#if ../../airdateWithoutTime ~}}
+                    <time datetime="{{this.htmlDateTime}}">
+                        {{loca "livestream_will_play" this.date}}
+                    </time>
+                {{else}}
+                    <time datetime="{{this.htmlDate}}">
+                        {{loca "livestream_will_play_with_time" this.date this.time}}
+                    </time>
+                {{~/if~}}
+            {{~/with~}}
+        {{/if~}}
+    {{/components/text/byline}}
+{{/with}}

package/dist/views/components/program/label_byline.ssi.hbs

@@ -0,0 +1,9 @@
+{{#with this.broadcast}}
+    {{#with this.startDate}}
+        {{#> components/text/byline _css="ml-2"}}
+            <time datetime='{{this.htmlDateTime}}'>
+                {{loca 'date_simple_at' this.dateWithTimeAndWeekday}}
+            </time>
+        {{/components/text/byline}}
+    {{/with}}
+{{/with}}

package/dist/views/components/teaser/cluster/teaser_cluster_item.hbs

@@ -1,13 +1,12 @@
 {{#decorator 'components/base/link' _css=(if _firstItem "group ds-teaser-focus" "group ds-link-clusterTeaser") }} 
-    {{> components/teaser/components/teaser_heading
-        _headlineTag="h3"
-        _headlineCss=""
-        _label=this.label
-        _size=_size
-        _title=this.title
-        _teaserType="cluster"
-        _ordered=_ordered
-        _titleCss='text-clusterTeaserLink'
-        _firstItem=_firstItem}}        
+    {{#with this.label}}
+        {{#> components/label/label_group _css=(if ../_ordered "pl-8")}}
+            {{> components/label/label _type=this.type _text=(loca this.loca) _css=""}}
+            {{> components/label/label_byline _css="ml-2"}}
+        {{/components/label/label_group}}
+    {{/with~}}
+    {{#> components/teaser/components/teaser_headline _headlineTag="h3"}}
+        {{> components/teaser/components/teaser_title _css=(appendToDefault (if _ordered "pl-8") "text-clusterTeaserLink") _text=this.title _size=_size _teaserType="cluster" _firstItem=_firstItem}}
+    {{/components/teaser/components/teaser_headline}}    
 {{/decorator}}
 {{> components/teaser/cluster/teaser_cluster_byline _ordered=_ordered}}

package/dist/views/components/teaser/components/teaser_body.hbs

@@ -1,21 +1,27 @@
 <div class="{{#if _outerCssClasses}} {{_outerCssClasses}}{{/if}}" 
 {{~#if this.isMobile1to1}}:class="{'basis-full w-full pr-10':avStart,'basis-3/5 w-3/5':!avStart}"{{/if}}>
-    <header class="sm:px-0{{#unless this.isMobile1to1}} px-5{{/unless}}">
+
+    
+    {{#> components/teaser/components/teaser_header _css=(if this.isMobile1to1 "" "px-5 sm:px-0")}}
         {{#decorator 'components/base/link' _css="ds-teaser-focus hover:text-toplineColor" }} 
-            {{> components/teaser/components/teaser_heading 
-            _fontVariant=this.headingFontVariant
-            _headlineTag=this.headlineTag 
-            _headlineCss="overflow-anywhere hyphens-auto"
-            _label=this.label 
-            _readMore=this.link.readMoreText.readMoreScreenreader 
-            _size=this.realTeaserSize 
-            _title=this.title 
-            _topline=this.topline 
-            _teaserType=this.teaserType
-            _isMobile1to1=this.isMobile1to1
-            _extendedTitle=this.extendedTitle}}            
-        {{/decorator}}   
-    </header>
+            {{#with this.label}}
+                {{#> components/label/label_group}}
+                    {{> components/label/label _type=this.type _text=(loca this.loca)}}
+                    {{> components/label/label_byline _css="ml-2"}}
+                {{/components/label/label_group}}
+            {{/with~}}
+            {{#> components/teaser/components/teaser_headline _headlineTag=this.headlineTag _css="overflow-anywhere hyphens-auto"}}
+                {{#if this.topline}}
+                    {{> components/teaser/components/teaser_topline _text=this.topline}}
+                {{/if}}
+                {{> components/teaser/components/teaser_title _text=this.title _size=this.realTeaserSize _teaserType=this.teaserType _isMobile1to1=this.isMobile1to1}}
+                {{#if this.extendedTitle}}
+                    {{> components/teaser/components/teaser_subline _text=this.extendedTitle}}
+                {{/if}}
+            {{/components/teaser/components/teaser_headline}}
+        {{/decorator}} 
+    {{/components/teaser/components/teaser_header}}
+
     <div class="sm:px-0{{#unless this.isMobile1to1}} px-5{{/unless}}">
         {{> components/teaser/components/teaser_text _text=this.shorttext _size=this.teaserSize}}
         {{> components/teaser/components/teaser_byline}} 

package/dist/views/components/teaser/components/teaser_header.hbs

@@ -1,3 +1,3 @@
-<header>
+<header{{#if _css}} class="{{_css}}"{{/if}}>
     {{> @partial-block }}
 </header>

package/dist/views/components/teaser/components/teaser_heading.hbs

@@ -1,6 +1,6 @@
 {{#with _label}}
     <div class="leading-5.5{{#if ../_ordered}} pl-8 {{/if}}">
-        {{> components/label/label _type=this.type _text=(loca this.loca) _bylineCss=../_labelCss}}
+        {{> components/label/label_old _type=this.type _text=(loca this.loca) _bylineCss=../_labelCss}}
     </div>
 {{/with~}}
 
@@ -9,7 +9,7 @@
     {{#if _topline}}
         {{> components/teaser/components/teaser_topline _css=(if _toplineCss _toplineCss "") _text=_topline _readMore=_readMore _teaserType=_teaserType}}
     {{/if}}
-    {{> components/teaser/components/teaser_title _css=(if _titleCss _titleCss "") _text=_title _fontVariant=_fontVariant _size=_size _teaserType=_teaserType _isMobile1to1=_isMobile1to1 _firstItem=_firstItem _ordered=_ordered}}
+    {{> components/teaser/components/teaser_title_old _css=(if _titleCss _titleCss "") _text=_title _fontVariant=_fontVariant _size=_size _teaserType=_teaserType _isMobile1to1=_isMobile1to1 _firstItem=_firstItem _ordered=_ordered}}
     {{#if _extendedTitle}}
         <span class="block text-subline font-normal font-heading text-base sm:text-lg mt-1 sm:mt-1.5 leading-6">{{_extendedTitle}}</span>
     {{/if}}

package/dist/views/components/teaser/components/teaser_subline.hbs

@@ -0,0 +1,3 @@
+<span
+    class='block text-subline font-normal font-heading text-base sm:text-lg mt-1 sm:mt-1.5 leading-6'
+>{{_text}}</span>

package/dist/views/components/teaser/components/teaser_title.hbs

@@ -1,3 +1,3 @@
-<span class='block mt-0.5 font-title font-bold group-hover:underline{{#if _css}} {{_css}}{{/if}}{{#if _ordered}} pl-8 {{/if}} {{> components/teaser/components/teaser_title_classes _size=_size _teaserType=_teaserType _fontVariant=_fontVariant _isMobile1to1=_isMobile1to1 _firstItem=_firstItem}}'>
+<span class='block mt-0.5 font-title font-bold {{> components/teaser/components/teaser_title_classes _size=_size _teaserType=_teaserType _isMobile1to1=_isMobile1to1 _firstItem=_firstItem}}{{#if _css}} {{_css}}{{/if}}'>
     {{~_text~}}
 </span>

package/dist/views/components/teaser/components/teaser_title_old.hbs

@@ -0,0 +1,3 @@
+<span class='block mt-0.5 font-title font-bold group-hover:underline{{#if _css}} {{_css}}{{/if}}{{#if _ordered}} pl-8 {{/if}} {{> components/teaser/components/teaser_title_classes _size=_size _teaserType=_teaserType _fontVariant=_fontVariant _isMobile1to1=_isMobile1to1 _firstItem=_firstItem}}'>
+    {{~_text~}}
+</span>

package/dist/views/components/teaser/stage/stage_text.hbs

@@ -1,37 +1,42 @@
 <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"]'}}">
-    <div class="relative p-4 rounded-2xl bg-stageTextBox opacity-85{{inline-switch this.stageTextPosition '["left100"]' '[" w-full"," max-w-xs sm:w-fit md:max-w-2/4"]'}} ">
-    {{#decorator 'components/base/link' _css="ds-teaser-focus before:rounded-2xl"}}
-        {{> components/teaser/components/teaser_heading _titleCss="text-stageText" _toplineCss="!text-stageText" _labelCss="text-stageText" _title=this.title _label=this.label _topline=this.topline _headlineTag="h2" _size="100" _teaserType="stage" _fontVariant="sans-serif"}}
-        {{#if this.showProfileInfoAsByline}}
-            <p class="block my-3 text-stageText font-headingSerif">{{this.profiles}}</p>
-        {{/if}}
-        {{#if this.showShorttext}}
-        <p class="hidden sm:block text-stageText">{{this.shorttext}}</p>
-            {{#if this.link.hasIcon}}
-            <span class="flex items-end space-around hover:underline decoration-1 text-stageLink">[{{this.link.readMoreText.readMore}}
-                {{> components/base/image/icon _icon=this.link.iconName _iconmap="icons" _addClass="w-5 h-5 self-baseline fill-current ml-1" }}]
-            </span>
+    <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"]'}} ">
+        {{#decorator 'components/base/link' _css="ds-teaser-focus before:rounded-2xl"}}
+            {{#> components/teaser/components/teaser_header}}
+                {{#with this.label}}
+                    {{#> components/label/label_group _css="!text-stageText"}}
+                        {{> components/label/label _css="text-stageText" _type=this.type _text=(loca this.loca)}}
+                        {{> components/label/label_byline _css="ml-2 text-inherit"}}
+                    {{/components/label/label_group}}
+                {{/with~}}
+                {{#> components/teaser/components/teaser_headline _css="text-stageText" _headlineTag="h2"}}
+                    {{#if this.topline}}
+                        {{> components/teaser/components/teaser_topline _css="!text-stageText" _text=this.topline}}
+                    {{/if}}
+                    {{> components/teaser/components/teaser_title _css="text-stageText" _text=this.title _size="100" _teaserType="stage"}}
+                    {{#with this.eventtags}}
+                        {{> components/event/event_tags this _css="hidden sm:block text-inherit"}} 
+                    {{/with}}
+                {{/components/teaser/components/teaser_headline}}
+                {{#if this.showProfileInfoAsByline}}
+                    <p class="block mt-3 text-stageText font-headingSerif">{{this.profiles}}</p>
+                {{/if}}
+            {{/components/teaser/components/teaser_header}}
+            {{#if this.showShorttext}}
+                <p class="pt-4 hidden sm:block text-stageText">{{this.shorttext}}</p>
+                {{#if this.link.hasIcon}}
+                <span class="flex items-end space-around hover:underline decoration-1 text-stageLink">[{{this.link.readMoreText.readMore}}
+                    {{> components/base/image/icon _icon=this.link.iconName _iconmap="icons" _addClass="w-5 h-5 self-baseline fill-current ml-1" }}]
+                </span>
+                {{/if}}
             {{/if}}
-        {{/if}}
-        {{#with this.eventtags}}
-            {{#with this.series}}
-                <span class="hidden font-heading text-stageText text-2xl font-normal leading-6 tracking-wide mt-2.5 -mb-1 sm:block">{{this.title}}</span>
-            {{/with}}
-            {{#with this.project}}
-                <span class="hidden font-heading text-stageText text-2xl font-normal leading-6 tracking-wide mt-2.5 -mb-1 sm:block">{{this.title}}</span>
-            {{/with}}
-            {{#with this.externalProject}}
-                <span class="hidden font-heading text-stageText text-2xl font-normal leading-6 tracking-wide mt-2.5 -mb-1 sm:block">{{this}}</span>
+            {{#with this.location}}
+                {{> components/base/loadSSI this.stageLocationSsi _templatePath='components/event/stage_location.ssi' }} 
             {{/with}}
-        {{/with}}
-        {{#with this.location}}
-            {{> components/base/loadSSI this.stageLocationSsi _templatePath='components/event/stage_location.ssi' }} 
-        {{/with}}
-        {{#if this.link.hasIcon}}
-            <span class="block mt-4 hover:underline text-stageLink {{if this.showShorttext 'hidden'}}">[{{this.link.readMoreText.readMore}}
-                {{> components/base/image/icon _icon=this.link.iconName _iconmap="icons" _addClass="inline w-5 h-5 self-baseline fill-current ml-1" }}]
-            </span>
-        {{/if}}
+            {{#if this.link.hasIcon}}
+                <span class="block mt-4 hover:underline text-stageLink {{if this.showShorttext 'hidden'}}">[{{this.link.readMoreText.readMore}}
+                    {{> components/base/image/icon _icon=this.link.iconName _iconmap="icons" _addClass="inline w-5 h-5 self-baseline fill-current ml-1" }}]
+                </span>
+            {{/if}}
         {{/decorator}}
     </div>
 </div>

package/dist/views/components/teaser/teaser_alternativ.hbs

@@ -1,4 +1,4 @@
-<article class="items-start relative col-span-12 flex md:flex-row gap-y-3 gap-x-4 md:gap-x-6 sm:px-0{{#unless this.isEvent}}{{~inline-switch this.teaserSize '["hero","100","50"]' '[" flex-col"," px-5 md:flex-row"," md:col-span-6 px-5 md:flex-row"]'~}}{{else}} items-start flex-col{{/unless}}"
+<article class="items-start relative col-span-12 flex md:flex-row gap-y-3 gap-x-4 md:gap-x-6 sm:px-0{{~inline-switch this.teaserSize '["hero","100","50"]' '[" flex-col"," px-5 md:flex-row"," md:col-span-6 px-5 md:flex-row"]'~}}"
     x-data="{ avStart: false }"
     {{#if this.isMobile1to1}}
             :class="avStart ? 'flex-col' : 'flex-row'"

package/dist/views/components/teaser/teaser_poster.hbs

@@ -4,18 +4,23 @@
     </figure> 
     <div class="absolute flex flex-col justify-center w-full h-full bg-gradient-to-t from-black rounded-tl-hr rounded-br-hr">
         {{#decorator 'components/base/link' _css="ds-teaser-focus flex items-center flex-col before:rounded-tl-hr before:rounded-br-hr hover:text-toplineColor"}} 
-            {{> components/teaser/components/teaser_heading 
-            _headlineTag="h2" 
-            _headlineCss="text-shadow text-center text-white mb-4 mx-4 md:mb-8 xs:mx-6 sm:mx-8 md:mx-5 lg:mx-8 line-clamp-4 xs:line-clamp-6 md:line-clamp-4 lg:line-clamp-5" 
-            _label=this.label 
-            _readMore=this.link.readMoreText.readMoreScreenreader 
-            _size=this.realTeaserSize 
-            _title=this.title
-            _titleCss="whitespace-pre-wrap"
-            _topline=this.topline 
-            _toplineCss="!text-white"
-            _teaserType=this.teaserType 
-            _font=(inline-switch isSerifHeading '[true, false]' '["font-headingSerif","font-heading font-bold"]') }}   
+            {{#> components/teaser/components/teaser_header}}
+                {{#with this.label}}
+                    {{#> components/label/label_group}}
+                        {{> components/label/label _type=this.type _text=(loca this.loca)}}
+                        {{> components/label/label_byline _css="ml-2"}}
+                    {{/components/label/label_group}}
+                {{/with~}}
+                 {{#> components/teaser/components/teaser_headline _headlineTag="h2" _css="text-shadow text-center text-white mb-4 mx-4 md:mb-8 xs:mx-6 sm:mx-8 md:mx-5 lg:mx-8 line-clamp-4 xs:line-clamp-6 md:line-clamp-4 lg:line-clamp-5"}}
+                    {{#if this.topline}}
+                        {{> components/teaser/components/teaser_topline _css="!text-white" _text=this.topline}}
+                    {{/if}}
+                    {{> components/teaser/components/teaser_title _css="whitespace-pre-wrap" _text=this.title _size=this.realTeaserSize _teaserType=this.teaserType}}
+                    {{#if this.extendedTitle}}
+                        {{> components/teaser/components/teaser_subline _text=this.extendedTitle}}
+                    {{/if}}
+                {{/components/teaser/components/teaser_headline}}
+            {{/components/teaser/components/teaser_header}}
         {{/decorator}}
         {{~> components/button/button_pseudo _type="hollow-white" _withLink=true _isLinkAriaHidden=true _linkCss="ds-cta absolute flex w-full h-full items-end justify-center" _buttonCss=(inline-switch this.realTeaserSize '["33","50"]' '["z-20 mb-7","z-20 mb-7 md:mb-16"]') _buttonText=this.link.readMoreText.readMoreLong ~}} 
     </div>

package/dist/views/components/text/byline.hbs

@@ -0,0 +1,3 @@
+<span class='text-xs text-inherit font-headingSerif{{#if _css}} {{_css}}{{/if}}'>
+    {{> @partial-block }}
+</span>

package/package.json

@@ -6,7 +6,7 @@
     "license": "MIT",
     "main": "dist/index.js",
     "repository": "https://github.com/szuelch/hr-design-system-handlebars",
-    "version": "1.1.7",
+    "version": "1.1.9",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",
         "storybook": "start-storybook -p 6006 public",

package/src/assets/brand/_default/conf/locatags.json

@@ -86,6 +86,10 @@
     "label_small-art": "Kleinkunst",
     "label_sports": "Sport",
     "label_talk": "Talk",
+    "livestream_has_played": "Beendet",
+    "livestream_plays": "Jetzt live",
+    "livestream_will_play": "Startet am {0}",
+    "livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
     "search_input_aria_submit": "Suche starten",
     "search_input_placeholder": "Ort oder Thema suchen",
     "ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hessenschau/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hr/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hr-bigband/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hr-fernsehen/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hr-inforadio/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hr-rundfunkrat/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hr-sinfonieorchester/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hr-werbung/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hr1/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hr2/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hr3/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",

package/src/assets/brand/hr4/conf/locatags.merged.json

@@ -86,6 +86,10 @@
 	"label_small-art": "Kleinkunst",
 	"label_sports": "Sport",
 	"label_talk": "Talk",
+	"livestream_has_played": "Beendet",
+	"livestream_plays": "Jetzt live",
+	"livestream_will_play": "Startet am {0}",
+	"livestream_will_play_with_time": "Startet am {0} um {1} Uhr",
 	"search_input_aria_submit": "Suche starten",
 	"search_input_placeholder": "Ort oder Thema suchen",
 	"ticket_modal_headline": "Weiterleitung zu einem Ticketservice",