hr-design-system-handlebars 0.87.1 → 0.87.3

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.
Files changed (26) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/dist/assets/index.css +33 -26
  3. package/dist/views/components/button/button.hbs +1 -1
  4. package/dist/views/components/button/button_round.hbs +4 -1
  5. package/dist/views/components/button/button_round_classes.hbs +24 -0
  6. package/dist/views/components/mediaplayer/media_player.hbs +3 -1
  7. package/dist/views/components/teaser/components/teaser_av_consumption.hbs +5 -5
  8. package/dist/views/components/teaser/components/teaser_lead.hbs +1 -1
  9. package/dist/views/components/teaser/podcast/podcast-playlist.hbs +4 -3
  10. package/dist/views/components/teaser/podcast/podcast.hbs +2 -2
  11. package/dist/views/components/teaser/teaser_alternativ.hbs +1 -1
  12. package/dist/views/components/teaser/teaser_standard.hbs +2 -2
  13. package/package.json +1 -1
  14. package/src/assets/fixtures/teaser/teaser_podcast_playlist_50.json +10 -0
  15. package/src/stories/views/components/button/button.hbs +1 -1
  16. package/src/stories/views/components/button/button_round.hbs +4 -1
  17. package/src/stories/views/components/button/button_round_classes.hbs +24 -0
  18. package/src/stories/views/components/mediaplayer/media_player.hbs +3 -1
  19. package/src/stories/views/components/teaser/components/teaser_av_consumption.hbs +5 -5
  20. package/src/stories/views/components/teaser/components/teaser_lead.hbs +1 -1
  21. package/src/stories/views/components/teaser/fixtures/teaser_podcast_playlist_50.json +1 -0
  22. package/src/stories/views/components/teaser/podcast/podcast-playlist.hbs +4 -3
  23. package/src/stories/views/components/teaser/podcast/podcast.hbs +2 -2
  24. package/src/stories/views/components/teaser/podcast/podcast.stories.mdx +13 -8
  25. package/src/stories/views/components/teaser/teaser_alternativ.hbs +1 -1
  26. package/src/stories/views/components/teaser/teaser_standard.hbs +2 -2
package/CHANGELOG.md CHANGED
@@ -1,3 +1,28 @@
1
+ # v0.87.3 (Wed Nov 23 2022)
2
+
3
+ #### 🐛 Bug Fix
4
+
5
+ - Podcast layout issues fixed [#396](https://github.com/mumprod/hr-design-system-handlebars/pull/396) ([@vascoeduardo](https://github.com/vascoeduardo))
6
+
7
+ #### Authors: 1
8
+
9
+ - Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
10
+
11
+ ---
12
+
13
+ # v0.87.2 (Wed Nov 23 2022)
14
+
15
+ #### 🐛 Bug Fix
16
+
17
+ - DPE-1875: fixes wrong playbutton-distances [#395](https://github.com/mumprod/hr-design-system-handlebars/pull/395) (saad.elbaciri@hr.de [@selbaciri](https://github.com/selbaciri))
18
+
19
+ #### Authors: 2
20
+
21
+ - Saad El Baciri ([@selbaciri](https://github.com/selbaciri))
22
+ - selbaciri (saad.elbaciri@hr.de)
23
+
24
+ ---
25
+
1
26
  # v0.87.1 (Tue Nov 22 2022)
2
27
 
3
28
  #### 🐛 Bug Fix
package/dist/assets/index.css CHANGED
@@ -745,30 +745,30 @@ video {
745
745
  .m-1 {
746
746
  margin: 0.25rem;
747
747
  }
748
+ .my-2 {
749
+ margin-top: 0.5rem;
750
+ margin-bottom: 0.5rem;
751
+ }
748
752
  .mx-2 {
749
753
  margin-left: 0.5rem;
750
754
  margin-right: 0.5rem;
751
755
  }
752
- .mx-0 {
753
- margin-left: 0px;
754
- margin-right: 0px;
756
+ .my-5 {
757
+ margin-top: 1.25rem;
758
+ margin-bottom: 1.25rem;
755
759
  }
756
760
  .mx-5 {
757
761
  margin-left: 1.25rem;
758
762
  margin-right: 1.25rem;
759
763
  }
760
- .my-5 {
761
- margin-top: 1.25rem;
762
- margin-bottom: 1.25rem;
764
+ .mx-0 {
765
+ margin-left: 0px;
766
+ margin-right: 0px;
763
767
  }
764
768
  .mx-4 {
765
769
  margin-left: 1rem;
766
770
  margin-right: 1rem;
767
771
  }
768
- .my-2 {
769
- margin-top: 0.5rem;
770
- margin-bottom: 0.5rem;
771
- }
772
772
  .mx-8 {
773
773
  margin-left: 2rem;
774
774
  margin-right: 2rem;
@@ -2249,7 +2249,7 @@ video {
2249
2249
  transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
2250
2250
  }
2251
2251
  .counter-reset {
2252
- counter-reset: cnt1669111038259;
2252
+ counter-reset: cnt1669210512894;
2253
2253
  }
2254
2254
  .line-clamp-4 {
2255
2255
  overflow: hidden;
@@ -2326,9 +2326,6 @@ video {
2326
2326
  [main-start] minmax(0, 63rem) [main-end]
2327
2327
  minmax(0, 1fr) [full-end];
2328
2328
  }
2329
- .col-main {
2330
- grid-column: main;
2331
- }
2332
2329
  .col-full {
2333
2330
  grid-column: full;
2334
2331
  }
@@ -2638,7 +2635,7 @@ video {
2638
2635
  --tw-ring-color: rgba(255, 255, 255, 0.5);
2639
2636
  }
2640
2637
  .-ordered {
2641
- counter-increment: cnt1669111038259 1;
2638
+ counter-increment: cnt1669210512894 1;
2642
2639
  }
2643
2640
  .-ordered::before {
2644
2641
  position: absolute;
@@ -2654,7 +2651,7 @@ video {
2654
2651
  letter-spacing: .0125em;
2655
2652
  --tw-text-opacity: 1;
2656
2653
  color: rgba(0, 0, 0, var(--tw-text-opacity));
2657
- content: counter(cnt1669111038259);
2654
+ content: counter(cnt1669210512894);
2658
2655
  }
2659
2656
  .\[-T\:\+Z\] {
2660
2657
  --t: +Z;
@@ -3450,6 +3447,26 @@ video {
3450
3447
  grid-column: span 9 / span 9;
3451
3448
  }
3452
3449
 
3450
+ .md\:my-3 {
3451
+ margin-top: 0.75rem;
3452
+ margin-bottom: 0.75rem;
3453
+ }
3454
+
3455
+ .md\:mx-3 {
3456
+ margin-left: 0.75rem;
3457
+ margin-right: 0.75rem;
3458
+ }
3459
+
3460
+ .md\:my-5 {
3461
+ margin-top: 1.25rem;
3462
+ margin-bottom: 1.25rem;
3463
+ }
3464
+
3465
+ .md\:mx-5 {
3466
+ margin-left: 1.25rem;
3467
+ margin-right: 1.25rem;
3468
+ }
3469
+
3453
3470
  .md\:mx-0 {
3454
3471
  margin-left: 0px;
3455
3472
  margin-right: 0px;
@@ -3465,16 +3482,6 @@ video {
3465
3482
  margin-bottom: 1rem;
3466
3483
  }
3467
3484
 
3468
- .md\:my-3 {
3469
- margin-top: 0.75rem;
3470
- margin-bottom: 0.75rem;
3471
- }
3472
-
3473
- .md\:mx-3 {
3474
- margin-left: 0.75rem;
3475
- margin-right: 0.75rem;
3476
- }
3477
-
3478
3485
  .md\:mt-0 {
3479
3486
  margin-top: 0px;
3480
3487
  }
package/dist/views/components/button/button.hbs CHANGED
@@ -3,7 +3,7 @@
3
3
  {{~#if _isButton}} type="button"{{else}} type="submit"{{/if~}}
4
4
  {{~#if _name}} name="{{_name}}"{{/if}}
5
5
  {{~#if _title}} title="{{_title}}"{{/if}}
6
- class="{{_addClass}}{{#if _addClass2}} {{_addClass2}}{{/if}}{{#if _buttonColor}} {{_buttonColor}}{{/if}}{{#if _buttonSpace}} {{_buttonSpace}}{{/if}}{{#if _webview}} -webview{{/if}}"
6
+ class="{{_addClass}}{{#if _addClass2}} {{_addClass2}}{{/if}}{{#if _buttonColor}} {{_buttonColor}}{{/if}}{{#if _buttonSpace}} {{> components/button/button_round_classes _teaserSize=_teaserSize _teaserType=_teaserType}}{{/if}}{{#if _webview}} -webview{{/if}}"
7
7
  {{~#if _value}} value="{{_value}}"{{/if}}
8
8
  {{~#if _alpineClick}} @click="{{_alpineClick}}"{{/if}}
9
9
  {{~#if _x-show}} x-show="{{_x-show}}"{{/if}}
package/dist/views/components/button/button_round.hbs CHANGED
@@ -15,5 +15,8 @@
15
15
  _alpineClick=_alpineClick
16
16
  _srOnly=_srOnly
17
17
  _buttonColor=_buttonColor
18
- _buttonSpace=_buttonSpace
18
+ _buttonSpace=true
19
+ _teaserType=_teaserType
20
+ _teaserSize=_teaserSize
21
+ _isMobile1to1=_isMobile1to1
19
22
  }}
package/dist/views/components/button/button_round_classes.hbs ADDED
@@ -0,0 +1,24 @@
1
+ {{~#switch _teaserType~}}
2
+ {{~#case 'standard-ds'~}}
3
+ {{~#if _isMobile1to1~}}
4
+ {{~inline-switch
5
+ _teaserSize '["25","33"]' '[" my-2 mx-2"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2 md:my-5 md:mx-5 "]'
6
+ ~}}
7
+ {{~else~}}
8
+ {{~inline-switch
9
+ _teaserSize '["25","33"]' '[" my-2 mx-2"," my-5 mx-5 md:my-3 md:mx-3"," my-5 mx-5"]'
10
+ ~}}
11
+ {{~/if~}}
12
+ {{~/case~}}
13
+ {{~#case 'alternative-ds'~}}
14
+ {{~#if _isMobile1to1~}}
15
+ {{~inline-switch
16
+ _teaserSize '["hero","100","50"]' '[" my-2 mx-2 md:my-5 md:mx-5"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2"]'
17
+ ~}}
18
+ {{~else~}}
19
+ {{~inline-switch
20
+ _teaserSize '["hero","100","50"]' '[" my-5 mx-5"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2"]'
21
+ ~}}
22
+ {{~/if~}}
23
+ {{~/case~}}
24
+ {{~/switch~}}
package/dist/views/components/mediaplayer/media_player.hbs CHANGED
@@ -24,7 +24,9 @@
24
24
  _isButton="true"
25
25
  _addClass='absolute bottom-0 right-0 fill-white hover:text-white js-mediaplayer__button'
26
26
  _buttonColor=(if _isLivestream ' text-orange-spicyCarrot hover:fill-orange-spicyCarrot' ' text-blue-jellyBean hover:fill-blue-jellyBean')
27
- _buttonSpace=(inline-switch _teaserSize '["25","33"]' '[" my-2 mx-2"," my-5 mx-5 md:my-3 md:mx-3"," my-5 mx-5"]')
27
+ _teaserType=_teaserType
28
+ _teaserSize=_teaserSize
29
+ _isMobile1to1=_isMobile1to1
28
30
  _showIcon=true
29
31
  _icon=_mediaButtonIcon
30
32
  _label=_mediaButtonLabel
package/dist/views/components/teaser/components/teaser_av_consumption.hbs CHANGED
@@ -1,7 +1,7 @@
1
1
  {{#with this.teaserLead.avDocument}}
2
2
  {{~#if this.isVideo ~}}
3
3
  {{#with this.toModel.videoElement}}
4
- {{~> components/mediaplayer/media_player _cypressHook="js-video-ondemand" _mediaButtonIcon="play_button" _mediaButtonLabel="Video" _isTeaser=true _teaser=../../this _aspectRatio=../../_aspectRatio _teaserSize=../../_teaserSize _isMobile1to1=../../_isMobile1to1 _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag~}}
4
+ {{~> components/mediaplayer/media_player _cypressHook="js-video-ondemand" _mediaButtonIcon="play_button" _mediaButtonLabel="Video" _isTeaser=true _teaser=../../this _aspectRatio=../../_aspectRatio _teaserSize=../../_teaserSize _isMobile1to1=../../_isMobile1to1 _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag _teaserType=../../_teaserType~}}
5
5
  {{#if ../../_isMobile1to1~}}
6
6
  {{> components/teaser/components/teaser_av_consumption_close_button _playerId=this.ardPlayerConfig.playerId }}
7
7
  {{~/if~}}
@@ -9,7 +9,7 @@
9
9
  {{~/if~}}
10
10
  {{~#if this.isAudio ~}}
11
11
  {{#with this.toModel.audioElement}}
12
- {{~> components/mediaplayer/media_player _cypressHook="js-audio-ondemand" _mediaButtonIcon="audio_button" _mediaButtonLabel="Audio" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag~}}
12
+ {{~> components/mediaplayer/media_player _cypressHook="js-audio-ondemand" _mediaButtonIcon="audio_button" _mediaButtonLabel="Audio" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag _teaserType=../../_teaserType~}}
13
13
  {{#if ../../_isMobile1to1~}}
14
14
  {{> components/teaser/components/teaser_av_consumption_close_button _playerId=this.ardPlayerConfig.playerId }}
15
15
  {{~/if~}}
@@ -17,7 +17,7 @@
17
17
  {{~/if~}}
18
18
  {{~#if this.isPodcast ~}}
19
19
  {{#with this.toModel.audioElement}}
20
- {{~> components/mediaplayer/media_player _cypressHook="js-audio-ondemand" _mediaButtonIcon="audio_button" _mediaButtonLabel="Podcast" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag~}}
20
+ {{~> components/mediaplayer/media_player _cypressHook="js-audio-ondemand" _mediaButtonIcon="audio_button" _mediaButtonLabel="Podcast" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag _teaserType=../../_teaserType~}}
21
21
  {{#if ../../_isMobile1to1~}}
22
22
  {{> components/teaser/components/teaser_av_consumption_close_button _playerId=this.ardPlayerConfig.playerId }}
23
23
  {{~/if~}}
@@ -25,7 +25,7 @@
25
25
  {{~/if~}}
26
26
  {{~#if this.isAudioEventLivestream ~}}
27
27
  {{#with this.toModel.audioLivestreamElement}}
28
- {{~> components/mediaplayer/media_player _cypressHook="js-video-livestream" _mediaButtonIcon="play_button" _mediaButtonLabel="Live" _isLivestream="true" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag~}}
28
+ {{~> components/mediaplayer/media_player _cypressHook="js-video-livestream" _mediaButtonIcon="play_button" _mediaButtonLabel="Live" _isLivestream="true" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag _teaserType=../../_teaserType~}}
29
29
  {{#if ../../_isMobile1to1~}}
30
30
  {{> components/teaser/components/teaser_av_consumption_close_button _playerId=this.ardPlayerConfig.playerId }}
31
31
  {{~/if~}}
@@ -33,7 +33,7 @@
33
33
  {{~/if~}}
34
34
  {{~#if this.isLivestream ~}}
35
35
  {{#with this.toModel.videoLivestreamElement}}
36
- {{~> components/mediaplayer/media_player _cypressHook="js-video-livestream" _mediaButtonIcon="play_button" _mediaButtonLabel="Live" _isLivestream="true" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag~}}
36
+ {{~> components/mediaplayer/media_player _cypressHook="js-video-livestream" _mediaButtonIcon="play_button" _mediaButtonLabel="Live" _isLivestream="true" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag _teaserType=../../_teaserType~}}
37
37
  {{#if ../../_isMobile1to1~}}
38
38
  {{> components/teaser/components/teaser_av_consumption_close_button _playerId=this.ardPlayerConfig.playerId }}
39
39
  {{~/if~}}
package/dist/views/components/teaser/components/teaser_lead.hbs CHANGED
@@ -1,5 +1,5 @@
1
1
  {{~#if this.allowAVConsumption ~}}
2
- {{> components/teaser/components/teaser_av_consumption _aspectRatio=_aspectRatio _isMobile1to1=_isMobile1to1 _teaserSize=_teaserSize }}
2
+ {{> components/teaser/components/teaser_av_consumption _aspectRatio=_aspectRatio _isMobile1to1=_isMobile1to1 _teaserSize=_teaserSize _teaserType=_teaserType }}
3
3
  {{else}}
4
4
  {{> components/teaser/components/teaser_image _isMobile1to1=_isMobile1to1 }}
5
5
  {{/if}}
package/dist/views/components/teaser/podcast/podcast-playlist.hbs CHANGED
@@ -1,3 +1,4 @@
1
- <div class="grid grid-cols-12 pt-5 mx-0 md:pt-5 bg-blue-accented rounded-tl-3xl rounded-br-3xl col-main gap-x-6 gap-y-6" >
2
- {{> components/teaser/podcast/podcast_playlist_player _linkTitle="true" _isSinglePage=false _type="podcastPlaylistPlayerTeaser" }}
3
- </div>
1
+
2
+ <div id="4" class="grid gap-y-6 relative gap-x-4 flex-col pt-5 mx-0 md:pt-5 bg-blue-accented rounded-tl-3xl rounded-br-3xl col-span-12 {{~inline-switch this.teaserSize '["50","100"]' '[" md:col-span-6",""]'}}" >
3
+ {{> components/teaser/podcast/podcast_playlist_player _linkTitle="true" _isSinglePage=false _type="podcastPlaylistPlayerTeaser" }}
4
+ </div>
package/dist/views/components/teaser/podcast/podcast.hbs CHANGED
@@ -1,3 +1,3 @@
1
- <div class="grid grid-cols-12 pt-5 mx-0 md:pt-5 bg-blue-accented rounded-tl-3xl rounded-br-3xl col-main gap-x-6 gap-y-6" >
1
+ <div class="grid gap-y-6 relative gap-x-4 flex-col pt-5 mx-0 md:pt-5 bg-blue-accented rounded-tl-3xl rounded-br-3xl col-span-12 {{~inline-switch this.teaserSize '["50","100"]' '[" md:col-span-6",""]'}}" >
2
2
  {{> components/teaser/podcast/podcast_player _linkTitle="true" _isSinglePage=true _type="podcastEpisodePlayerTeaser" }}
3
- </div>
3
+ </div>
package/dist/views/components/teaser/teaser_alternativ.hbs CHANGED
@@ -5,7 +5,7 @@
5
5
  {{/if}}
6
6
  >
7
7
  <figure class="relative {{~inline-switch this.teaserSize '["hero","100","50"]' '[" basis-2/3 ar-16-9"," ar-1-1 md:ar-16-9 basis-2/5 md:basis-1/3"," ar-1-1 md:ar-16-9 basis-2/5 md:basis-1/2"]'~}}">
8
- {{> components/teaser/components/teaser_lead _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _aspectRatio=(inline-switch this.teaserSize '["hero"]' '["ar-16-9","ar-1-1 md:ar-16-9"]') }}
8
+ {{> components/teaser/components/teaser_lead _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _teaserType=this.teaserType _aspectRatio=(inline-switch this.teaserSize '["hero"]' '["ar-16-9","ar-1-1 md:ar-16-9"]') }}
9
9
  </figure>
10
10
  {{> components/teaser/components/teaser_body _outerCssClasses=(inline-switch this.teaserSize '["hero","100","50"]' '["basis-1/3"," basis-3/5 md:basis-2/3"," basis-3/5 md:basis-1/2"]') }}
11
11
  </article>
package/dist/views/components/teaser/teaser_standard.hbs CHANGED
@@ -9,11 +9,11 @@
9
9
  >
10
10
  <figure class="relative
11
11
  {{~#if this.isMobile1to1}} basis-2/5 md:flex-full ar-1-1 md:ar-16-9{{else}} ar-16-9{{/if~}}">
12
- {{> components/teaser/components/teaser_lead _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _aspectRatio=(inline-switch this.teaserSize '["25"]' '["ar-1-1 md:ar-16-9", "ar-16-9"]') }}
12
+ {{> components/teaser/components/teaser_lead _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _teaserType=this.teaserType _aspectRatio=(inline-switch this.teaserSize '["25"]' '["ar-1-1 md:ar-16-9", "ar-16-9"]') }}
13
13
  </figure>
14
14
  {{#if this.displayTeaserBodyAsImageOverlay}}
15
15
  {{#decorator 'components/teaser/components/teaser_image_overlay' _noOverlayInMobileViewports=true _cssClasses=" relative md:absolute w-full bottom-0"}}
16
- <div class="flex flex-col items-center justify-center p-4 border-dashed border-r border-gray-400">
16
+ <div class="flex flex-col items-center justify-center p-4 border-r border-gray-400 border-dashed">
17
17
  {{> components/event/instant_dates}}
18
18
  </div>
19
19
  {{> components/teaser/components/teaser_body _outerCssClasses=(if this.isMobile1to1 'py-4 md:px-4 basis-3/5 md:flex-full' 'py-4 md:px-4')}}
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": "0.87.1",
9
+ "version": "0.87.3",
10
10
  "scripts": {
11
11
  "test": "echo \"Error: no test specified\" && exit 1",
12
12
  "storybook": "start-storybook -p 6006 public",
package/src/assets/fixtures/teaser/teaser_podcast_playlist_50.json ADDED
@@ -0,0 +1,10 @@
1
+ {
2
+ "@->jsoninclude": "teaser/teasersPodcastPlaylist.inc.json",
3
+ "@->contentpath": "teaserPodcastPlaylist",
4
+ "@->overrides": [
5
+ {
6
+ "@->contentpath": "logicItem.includeModel.teaserSize",
7
+ "@->value": "50"
8
+ }
9
+ ]
10
+ }
package/src/stories/views/components/button/button.hbs CHANGED
@@ -3,7 +3,7 @@
3
3
  {{~#if _isButton}} type="button"{{else}} type="submit"{{/if~}}
4
4
  {{~#if _name}} name="{{_name}}"{{/if}}
5
5
  {{~#if _title}} title="{{_title}}"{{/if}}
6
- class="{{_addClass}}{{#if _addClass2}} {{_addClass2}}{{/if}}{{#if _buttonColor}} {{_buttonColor}}{{/if}}{{#if _buttonSpace}} {{_buttonSpace}}{{/if}}{{#if _webview}} -webview{{/if}}"
6
+ class="{{_addClass}}{{#if _addClass2}} {{_addClass2}}{{/if}}{{#if _buttonColor}} {{_buttonColor}}{{/if}}{{#if _buttonSpace}} {{> components/button/button_round_classes _teaserSize=_teaserSize _teaserType=_teaserType}}{{/if}}{{#if _webview}} -webview{{/if}}"
7
7
  {{~#if _value}} value="{{_value}}"{{/if}}
8
8
  {{~#if _alpineClick}} @click="{{_alpineClick}}"{{/if}}
9
9
  {{~#if _x-show}} x-show="{{_x-show}}"{{/if}}
package/src/stories/views/components/button/button_round.hbs CHANGED
@@ -15,5 +15,8 @@
15
15
  _alpineClick=_alpineClick
16
16
  _srOnly=_srOnly
17
17
  _buttonColor=_buttonColor
18
- _buttonSpace=_buttonSpace
18
+ _buttonSpace=true
19
+ _teaserType=_teaserType
20
+ _teaserSize=_teaserSize
21
+ _isMobile1to1=_isMobile1to1
19
22
  }}
package/src/stories/views/components/button/button_round_classes.hbs ADDED
@@ -0,0 +1,24 @@
1
+ {{~#switch _teaserType~}}
2
+ {{~#case 'standard-ds'~}}
3
+ {{~#if _isMobile1to1~}}
4
+ {{~inline-switch
5
+ _teaserSize '["25","33"]' '[" my-2 mx-2"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2 md:my-5 md:mx-5 "]'
6
+ ~}}
7
+ {{~else~}}
8
+ {{~inline-switch
9
+ _teaserSize '["25","33"]' '[" my-2 mx-2"," my-5 mx-5 md:my-3 md:mx-3"," my-5 mx-5"]'
10
+ ~}}
11
+ {{~/if~}}
12
+ {{~/case~}}
13
+ {{~#case 'alternative-ds'~}}
14
+ {{~#if _isMobile1to1~}}
15
+ {{~inline-switch
16
+ _teaserSize '["hero","100","50"]' '[" my-2 mx-2 md:my-5 md:mx-5"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2"]'
17
+ ~}}
18
+ {{~else~}}
19
+ {{~inline-switch
20
+ _teaserSize '["hero","100","50"]' '[" my-5 mx-5"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2"]'
21
+ ~}}
22
+ {{~/if~}}
23
+ {{~/case~}}
24
+ {{~/switch~}}
package/src/stories/views/components/mediaplayer/media_player.hbs CHANGED
@@ -24,7 +24,9 @@
24
24
  _isButton="true"
25
25
  _addClass='absolute bottom-0 right-0 fill-white hover:text-white js-mediaplayer__button'
26
26
  _buttonColor=(if _isLivestream ' text-orange-spicyCarrot hover:fill-orange-spicyCarrot' ' text-blue-jellyBean hover:fill-blue-jellyBean')
27
- _buttonSpace=(inline-switch _teaserSize '["25","33"]' '[" my-2 mx-2"," my-5 mx-5 md:my-3 md:mx-3"," my-5 mx-5"]')
27
+ _teaserType=_teaserType
28
+ _teaserSize=_teaserSize
29
+ _isMobile1to1=_isMobile1to1
28
30
  _showIcon=true
29
31
  _icon=_mediaButtonIcon
30
32
  _label=_mediaButtonLabel
package/src/stories/views/components/teaser/components/teaser_av_consumption.hbs CHANGED
@@ -1,7 +1,7 @@
1
1
  {{#with this.teaserLead.avDocument}}
2
2
  {{~#if this.isVideo ~}}
3
3
  {{#with this.toModel.videoElement}}
4
- {{~> components/mediaplayer/media_player _cypressHook="js-video-ondemand" _mediaButtonIcon="play_button" _mediaButtonLabel="Video" _isTeaser=true _teaser=../../this _aspectRatio=../../_aspectRatio _teaserSize=../../_teaserSize _isMobile1to1=../../_isMobile1to1 _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag~}}
4
+ {{~> components/mediaplayer/media_player _cypressHook="js-video-ondemand" _mediaButtonIcon="play_button" _mediaButtonLabel="Video" _isTeaser=true _teaser=../../this _aspectRatio=../../_aspectRatio _teaserSize=../../_teaserSize _isMobile1to1=../../_isMobile1to1 _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag _teaserType=../../_teaserType~}}
5
5
  {{#if ../../_isMobile1to1~}}
6
6
  {{> components/teaser/components/teaser_av_consumption_close_button _playerId=this.ardPlayerConfig.playerId }}
7
7
  {{~/if~}}
@@ -9,7 +9,7 @@
9
9
  {{~/if~}}
10
10
  {{~#if this.isAudio ~}}
11
11
  {{#with this.toModel.audioElement}}
12
- {{~> components/mediaplayer/media_player _cypressHook="js-audio-ondemand" _mediaButtonIcon="audio_button" _mediaButtonLabel="Audio" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag~}}
12
+ {{~> components/mediaplayer/media_player _cypressHook="js-audio-ondemand" _mediaButtonIcon="audio_button" _mediaButtonLabel="Audio" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag _teaserType=../../_teaserType~}}
13
13
  {{#if ../../_isMobile1to1~}}
14
14
  {{> components/teaser/components/teaser_av_consumption_close_button _playerId=this.ardPlayerConfig.playerId }}
15
15
  {{~/if~}}
@@ -17,7 +17,7 @@
17
17
  {{~/if~}}
18
18
  {{~#if this.isPodcast ~}}
19
19
  {{#with this.toModel.audioElement}}
20
- {{~> components/mediaplayer/media_player _cypressHook="js-audio-ondemand" _mediaButtonIcon="audio_button" _mediaButtonLabel="Podcast" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag~}}
20
+ {{~> components/mediaplayer/media_player _cypressHook="js-audio-ondemand" _mediaButtonIcon="audio_button" _mediaButtonLabel="Podcast" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag _teaserType=../../_teaserType~}}
21
21
  {{#if ../../_isMobile1to1~}}
22
22
  {{> components/teaser/components/teaser_av_consumption_close_button _playerId=this.ardPlayerConfig.playerId }}
23
23
  {{~/if~}}
@@ -25,7 +25,7 @@
25
25
  {{~/if~}}
26
26
  {{~#if this.isAudioEventLivestream ~}}
27
27
  {{#with this.toModel.audioLivestreamElement}}
28
- {{~> components/mediaplayer/media_player _cypressHook="js-video-livestream" _mediaButtonIcon="play_button" _mediaButtonLabel="Live" _isLivestream="true" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag~}}
28
+ {{~> components/mediaplayer/media_player _cypressHook="js-video-livestream" _mediaButtonIcon="play_button" _mediaButtonLabel="Live" _isLivestream="true" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag _teaserType=../../_teaserType~}}
29
29
  {{#if ../../_isMobile1to1~}}
30
30
  {{> components/teaser/components/teaser_av_consumption_close_button _playerId=this.ardPlayerConfig.playerId }}
31
31
  {{~/if~}}
@@ -33,7 +33,7 @@
33
33
  {{~/if~}}
34
34
  {{~#if this.isLivestream ~}}
35
35
  {{#with this.toModel.videoLivestreamElement}}
36
- {{~> components/mediaplayer/media_player _cypressHook="js-video-livestream" _mediaButtonIcon="play_button" _mediaButtonLabel="Live" _isLivestream="true" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag~}}
36
+ {{~> components/mediaplayer/media_player _cypressHook="js-video-livestream" _mediaButtonIcon="play_button" _mediaButtonLabel="Live" _isLivestream="true" _isTeaser=true _teaser=../../this _audioUrl=../this.audioUrl _variant=../this.imageVariant _noDelay=../../_noDelay _aspectRatio=../../_aspectRatio _isMobile1to1=../../_isMobile1to1 _teaserSize=../../_teaserSize _geotag=../../this.geotag _hideGeotag=../../this.hideGeotag _teaserType=../../_teaserType~}}
37
37
  {{#if ../../_isMobile1to1~}}
38
38
  {{> components/teaser/components/teaser_av_consumption_close_button _playerId=this.ardPlayerConfig.playerId }}
39
39
  {{~/if~}}
package/src/stories/views/components/teaser/components/teaser_lead.hbs CHANGED
@@ -1,5 +1,5 @@
1
1
  {{~#if this.allowAVConsumption ~}}
2
- {{> components/teaser/components/teaser_av_consumption _aspectRatio=_aspectRatio _isMobile1to1=_isMobile1to1 _teaserSize=_teaserSize }}
2
+ {{> components/teaser/components/teaser_av_consumption _aspectRatio=_aspectRatio _isMobile1to1=_isMobile1to1 _teaserSize=_teaserSize _teaserType=_teaserType }}
3
3
  {{else}}
4
4
  {{> components/teaser/components/teaser_image _isMobile1to1=_isMobile1to1 }}
5
5
  {{/if}}
package/src/stories/views/components/teaser/fixtures/teaser_podcast_playlist_50.json ADDED
@@ -0,0 +1 @@
1
+ {"logicItem":{"includePath":"components/teaser/podcast/podcast-playlist","includeModel":{"teaserSize":"50","isSingleChannel":true,"url":"#url","title":"Im Haifischbecken - der Social-Media-Podcast","shortText":"shortText","dontLazyload":true,"genreImage":{"copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/aufmacher-im-haifischbecken-100_v-1to1__medium.jpg","sources":[{"sizes":"300px","srcset":"images/aufmacher-im-haifischbecken-100_v-1to1__small.jpg 380w, images/aufmacher-im-haifischbecken-100_v-1to1__medium.jpg 480w, images/aufmacher-im-haifischbecken-100_v-1to1.jpg 720w, images/aufmacher-im-haifischbecken-100_v-1to1__large.jpg 960w"}]}},"playlistItems":[{"byline":"Byline","title":"Ein Podcast-Title","topline":"","headingFontVariant":"serif","extendedTitle":"","teaserType":"standard-ds","teaserSize":"100","isMobile1to1":false,"airdateDate":{"htmlDateTime":"2022-10-31T19:30+0200","htmlDate":"31.10.2022","date":"31.10.22","dateSeparatorTime":"31.10.22, 19:30"},"teaseritem":{"copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/heiner-goebbels-102_v-1to1__medium.jpg","sources":[{"sizes":"300px","srcset":"images/heiner-goebbels-102_v-1to1__small.jpg 380w, images/heiner-goebbels-102_v-1to1__medium.jpg 480w, images/heiner-goebbels-102_v-1to1.jpg 720w, images/heiner-goebbels-102_v-1to1__large.jpg 960w"}]}},"podcastDuration":"53:13","teaserInfo":{"showTeaserInfo":true,"showTeaserInfoSection":true,"showTeaserInfoChannel":true,"showTeaserInfoAll":true,"showTeaserInfoDate":false,"showTeaserInfoDateTime":true,"showTeaserInfoProgramRef":true},"podcastChannel":{"title":"hr2 Doppelkopf","url":"#ChannelURL","podcastHoster":[{"podcastHosterUrl":"https://podcasts.apple.com/podcast/hr2-doppelkopf/id212822590","podcastHosterName":"ITunes"},{"podcastHosterUrl":"https://podcast.hr.de/hr2_doppelkopf/podcast.xml","podcastHosterName":"RSS"},{"podcastHosterUrl":"https://podcasts.google.com/feed/aHR0cHM6Ly9wb2RjYXN0LmhyLmRlL2hyMl9kb3BwZWxrb3BmL3BvZGNhc3QueG1s?hl=de","podcastHosterName":"Google Podcasts"},{"podcastHosterUrl":"https://www.ardaudiothek.de/episode/hr2-doppelkopf/ich-hoere-bei-jedem-geraeusch-gleich-die-tonhoehe-oder-komponist-und-theatermacher-heiner-goebbels-erneuert-das-musiktheater/hr2-kultur/12056783/","podcastHosterName":"ARD Audiothek"}]},"audioUrl":"https://mp3podcasthrdl-a.akamaihd.net/mp3/podcast/hr2_doppelkopf/hr2_doppelkopf_20221031_96251016.mp3","podcastDownloadUrl":"https://mp3podcasthrdl-a.akamaihd.net/mp3/podcast/hr2_doppelkopf/hr2_doppelkopf_20221031_96251016.mp3","teaserImage":{"copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/heiner-goebbels-102_v-1to1__medium.jpg","sources":[{"sizes":"300px","srcset":"images/heiner-goebbels-102_v-1to1__small.jpg 380w, images/heiner-goebbels-102_v-1to1__medium.jpg 480w, images/heiner-goebbels-102_v-1to1.jpg 720w, images/heiner-goebbels-102_v-1to1__large.jpg 960w"}]}},"documentSection":"Kultur","displayTeaserBodyAsImageOverlay":false,"hasMediaButtons":false,"dontLazyload":true,"isStandardTeaser":false,"isHeroTeaser":true,"isMediaTeaser":false,"isGuide":false,"isProgram":false,"isEvent":false,"isTicker":false,"isAudio":false,"isVideo":false,"isPodcastEpisode":true,"isExtOrBrandLink":false,"isAuthor":false,"copyright":"Copyright Text","audioAuthor":"Stefan Fricke","hasStatus":false,"hasTeaserItem":true,"allowAVConsumption":false,"displayEpgInfos":false,"aspectRatio":"ar--teaserTop","hideGeotag":false,"hideEditableByline":true,"doTracking":true,"trackingForArdMediatheksLink":false,"showMediatheksLink":false,"showAirdate":true,"showProfileInfoAsByline":false,"obsolet_brandOfTeaser":"hessenschau","headlineTag":"h2","icon":"ortsmarke","imageVariant":"topteaser","hideShortText":false,"shorttext":"Bla ..... Vor einem Jahr wurde die syrische Familie Kheder aus Wolfhagen abgeschoben. Die Gemeinde setzte alle Hebel in Bewegung, um Mutter, Tochter und Sohn zurückzuholen. Im Fall der Kinder hat das nun zu einem Happy End geführt. Doch ihre liebe Mutter fehlt.","sophoraId":"rueckkehr-nach-abschiebung-wolfhagen--100","profiles":"Von Alf Haubitz und Alice Merton","teaserLead":{"isPodcast":true,"toModel":{"audioElement":{"isPodcast":true,"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"http://localhost:8080/site/hessenschau/assets_2.85.0/vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"site":"551103","config":{"getCollectDomainSSL":"logs1406.xiti.com","secure":true},"page":{"name":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audio:audioPlay","level2":"4","chapter1":"Audio-Start","chapter2":"OnDemand","customVars":{"site":{"1":"podcast-episode-43976","2":"hr-nt:podcastEpisode","5":"202203230802"}}},"richMedia":{"mediaType":"audio","playerId":"4076","mediaLevel2":"4","mediaLabel":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audioPlay","mediaTheme1":"OnDemand","duration":"3040","broadcastMode":"clip"}}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://mp3podcasthr-a.akamaihd.net/mp3/podcast/derTag/derTag_20190320_81142988.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":3040,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Muslim Fashion. Mehr als ein Kopftuch.","synopsis":"Wo immer die Ausstellung \"Contemporary Muslim Fashion“ ins Museum kommt, entfacht sie heftige Diskussionen. Nachdem die Schau in San Francisco für Furore sorgte, wird sie demnächst im Frankfurter Museum für Angewandte Kunst als erste Station in Europa gezeigt. Die \"Modest Fashion“, die dezente Mode, so das Schlagwort für die verhüllende, aber keineswegs unsichtbar machende Mode, spaltet das feministische Lager: Ist sie eine Momentaufnahme aktueller muslimischer Kleidungsstile aus aller Welt oder Werbung für die weibliche Verschleierung? In jedem Fall zeigt die Ausstellung, dass die Verhüllung des weiblichen Körpers und der Frisur nicht nur trist, sondern auch schön sein kann - und für manche Trägerinnen befreiend. Und sie ist durchaus politisch, diskutiert gesetzliche Kleiderordnungen und die Frage politischer Symbolik. Inzwischen wollen auch westliche Firmen von der Vielfalt muslimischer Mode profitieren. Sie haben die Konsumentinnen im Nahen Osten und Südostasien als kaufkräftige Klientel entdeckt. Dort ist ein riesiger Markt zu erschließen. Nicht selten wagen sie sich damit an die Grenzen religiöser und gesellschaftlicher Akzeptanz. Kann Mode solche Grenzen überwinden? "},"pluginData":{},"geoBlocked":false},"playerId":"4076","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.4fc164e9.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.8ea4ea3d.js","isAutoplay":true,"teaserSize":"50"},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"http://localhost:8080/site/hessenschau/assets_2.85.0/vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"site":"551103","config":{"getCollectDomainSSL":"logs1406.xiti.com","secure":true},"page":{"name":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audio:audioPlay","level2":"4","chapter1":"Audio-Start","chapter2":"OnDemand","customVars":{"site":{"1":"podcast-episode-43976","2":"hr-nt:podcastEpisode","5":"202203230802"}}},"richMedia":{"mediaType":"audio","playerId":"4076","mediaLevel2":"4","mediaLabel":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audioPlay","mediaTheme1":"OnDemand","duration":"3040","broadcastMode":"clip"}}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://mp3podcasthr-a.akamaihd.net/mp3/podcast/derTag/derTag_20190320_81142988.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":3040,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Muslim Fashion. Mehr als ein Kopftuch.","synopsis":"Wo immer die Ausstellung \"Contemporary Muslim Fashion“ ins Museum kommt, entfacht sie heftige Diskussionen. Nachdem die Schau in San Francisco für Furore sorgte, wird sie demnächst im Frankfurter Museum für Angewandte Kunst als erste Station in Europa gezeigt. Die \"Modest Fashion“, die dezente Mode, so das Schlagwort für die verhüllende, aber keineswegs unsichtbar machende Mode, spaltet das feministische Lager: Ist sie eine Momentaufnahme aktueller muslimischer Kleidungsstile aus aller Welt oder Werbung für die weibliche Verschleierung? In jedem Fall zeigt die Ausstellung, dass die Verhüllung des weiblichen Körpers und der Frisur nicht nur trist, sondern auch schön sein kann - und für manche Trägerinnen befreiend. Und sie ist durchaus politisch, diskutiert gesetzliche Kleiderordnungen und die Frage politischer Symbolik. Inzwischen wollen auch westliche Firmen von der Vielfalt muslimischer Mode profitieren. Sie haben die Konsumentinnen im Nahen Osten und Südostasien als kaufkräftige Klientel entdeckt. Dort ist ein riesiger Markt zu erschließen. Nicht selten wagen sie sich damit an die Grenzen religiöser und gesellschaftlicher Akzeptanz. Kann Mode solche Grenzen überwinden? "},"pluginData":{},"geoBlocked":false},"playerId":"4076","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.4fc164e9.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.8ea4ea3d.js","isAutoplay":true,"teaserSize":"50"}}}},"link":{"url":"/teaser1","webviewUrl":"/teaser1#webview","isTargetBlank":false,"hasIcon":false,"iconName":"iconName","readMoreText":{"readMoreScreenreader":"Zum Artikel","readMore":"mehr","readMoreLong":"read More Long"}},"label":{"type":"podcast","loca":"label_podcast","byline":{"bylineSsi":"53:13 min","bylineText":""}}},{"byline":"Byline","title":"Ein anderer Podcast-Title","topline":"","headingFontVariant":"serif","extendedTitle":"","teaserType":"standard-ds","teaserSize":"100","isMobile1to1":false,"airdateDate":{"htmlDateTime":"2022-10-31T19:30+0200","htmlDate":"31.10.2022","date":"24.12.20","dateSeparatorTime":"31.10.22, 19:30"},"teaseritem":{"copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/heiner-goebbels-102_v-1to1__medium.jpg","sources":[{"sizes":"300px","srcset":"images/heiner-goebbels-102_v-1to1__small.jpg 380w, images/heiner-goebbels-102_v-1to1__medium.jpg 480w, images/heiner-goebbels-102_v-1to1.jpg 720w, images/heiner-goebbels-102_v-1to1__large.jpg 960w"}]}},"podcastDuration":"13:11","teaserInfo":{"showTeaserInfo":true,"showTeaserInfoSection":true,"showTeaserInfoChannel":true,"showTeaserInfoAll":true,"showTeaserInfoDate":false,"showTeaserInfoDateTime":true,"showTeaserInfoProgramRef":true},"podcastChannel":{"title":"hr2 Doppelkopf","url":"#ChannelURL","podcastHoster":[{"podcastHosterUrl":"https://podcasts.apple.com/podcast/hr2-doppelkopf/id212822590","podcastHosterName":"ITunes"},{"podcastHosterUrl":"https://podcast.hr.de/hr2_doppelkopf/podcast.xml","podcastHosterName":"RSS"},{"podcastHosterUrl":"https://podcasts.google.com/feed/aHR0cHM6Ly9wb2RjYXN0LmhyLmRlL2hyMl9kb3BwZWxrb3BmL3BvZGNhc3QueG1s?hl=de","podcastHosterName":"Google Podcasts"},{"podcastHosterUrl":"https://www.ardaudiothek.de/episode/hr2-doppelkopf/ich-hoere-bei-jedem-geraeusch-gleich-die-tonhoehe-oder-komponist-und-theatermacher-heiner-goebbels-erneuert-das-musiktheater/hr2-kultur/12056783/","podcastHosterName":"ARD Audiothek"}]},"audioUrl":"https://mp3podcasthr-a.akamaihd.net/mp3/podcast/der_tag_in_hessen/der_tag_in_hessen_20221021_96203008.mp3","podcastDownloadUrl":"https://mp3podcasthrdl-a.akamaihd.net/mp3/podcast/hr2_doppelkopf/hr2_doppelkopf_20221031_96251016.mp3","teaserImage":{"copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/heiner-goebbels-102_v-1to1__medium.jpg","sources":[{"sizes":"300px","srcset":"images/heiner-goebbels-102_v-1to1__small.jpg 380w, images/heiner-goebbels-102_v-1to1__medium.jpg 480w, images/heiner-goebbels-102_v-1to1.jpg 720w, images/heiner-goebbels-102_v-1to1__large.jpg 960w"}]}},"documentSection":"Kultur","displayTeaserBodyAsImageOverlay":false,"hasMediaButtons":false,"dontLazyload":true,"isStandardTeaser":false,"isHeroTeaser":true,"isMediaTeaser":false,"isGuide":false,"isProgram":false,"isEvent":false,"isTicker":false,"isAudio":false,"isVideo":false,"isPodcastEpisode":true,"isExtOrBrandLink":false,"isAuthor":false,"copyright":"Copyright Text","audioAuthor":"Stefan Fricke","hasStatus":false,"hasTeaserItem":true,"allowAVConsumption":false,"displayEpgInfos":false,"aspectRatio":"ar--teaserTop","hideGeotag":false,"hideEditableByline":true,"doTracking":true,"trackingForArdMediatheksLink":false,"showMediatheksLink":false,"showAirdate":true,"showProfileInfoAsByline":false,"obsolet_brandOfTeaser":"hessenschau","headlineTag":"h2","icon":"ortsmarke","imageVariant":"topteaser","hideShortText":false,"shorttext":"Bla ..... Vor einem Jahr wurde die syrische Familie Kheder aus Wolfhagen abgeschoben. Die Gemeinde setzte alle Hebel in Bewegung, um Mutter, Tochter und Sohn zurückzuholen. Im Fall der Kinder hat das nun zu einem Happy End geführt. Doch ihre liebe Mutter fehlt.","sophoraId":"rueckkehr-nach-abschiebung-wolfhagen--100","profiles":"Von Alf Haubitz und Alice Merton","teaserLead":{"isPodcast":true,"toModel":{"audioElement":{"isPodcast":true,"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"http://localhost:8080/site/hessenschau/assets_2.85.0/vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"site":"551103","config":{"getCollectDomainSSL":"logs1406.xiti.com","secure":true},"page":{"name":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audio:audioPlay","level2":"4","chapter1":"Audio-Start","chapter2":"OnDemand","customVars":{"site":{"1":"podcast-episode-43976","2":"hr-nt:podcastEpisode","5":"202203230802"}}},"richMedia":{"mediaType":"audio","playerId":"4076","mediaLevel2":"4","mediaLabel":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audioPlay","mediaTheme1":"OnDemand","duration":"3040","broadcastMode":"clip"}}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://mp3podcasthr-a.akamaihd.net/mp3/podcast/derTag/derTag_20190320_81142988.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":3040,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Muslim Fashion. Mehr als ein Kopftuch.","synopsis":"Wo immer die Ausstellung \"Contemporary Muslim Fashion“ ins Museum kommt, entfacht sie heftige Diskussionen. Nachdem die Schau in San Francisco für Furore sorgte, wird sie demnächst im Frankfurter Museum für Angewandte Kunst als erste Station in Europa gezeigt. Die \"Modest Fashion“, die dezente Mode, so das Schlagwort für die verhüllende, aber keineswegs unsichtbar machende Mode, spaltet das feministische Lager: Ist sie eine Momentaufnahme aktueller muslimischer Kleidungsstile aus aller Welt oder Werbung für die weibliche Verschleierung? In jedem Fall zeigt die Ausstellung, dass die Verhüllung des weiblichen Körpers und der Frisur nicht nur trist, sondern auch schön sein kann - und für manche Trägerinnen befreiend. Und sie ist durchaus politisch, diskutiert gesetzliche Kleiderordnungen und die Frage politischer Symbolik. Inzwischen wollen auch westliche Firmen von der Vielfalt muslimischer Mode profitieren. Sie haben die Konsumentinnen im Nahen Osten und Südostasien als kaufkräftige Klientel entdeckt. Dort ist ein riesiger Markt zu erschließen. Nicht selten wagen sie sich damit an die Grenzen religiöser und gesellschaftlicher Akzeptanz. Kann Mode solche Grenzen überwinden? "},"pluginData":{},"geoBlocked":false},"playerId":"4076","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.4fc164e9.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.8ea4ea3d.js","isAutoplay":true,"teaserSize":"50"},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"http://localhost:8080/site/hessenschau/assets_2.85.0/vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"site":"551103","config":{"getCollectDomainSSL":"logs1406.xiti.com","secure":true},"page":{"name":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audio:audioPlay","level2":"4","chapter1":"Audio-Start","chapter2":"OnDemand","customVars":{"site":{"1":"podcast-episode-43976","2":"hr-nt:podcastEpisode","5":"202203230802"}}},"richMedia":{"mediaType":"audio","playerId":"4076","mediaLevel2":"4","mediaLabel":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audioPlay","mediaTheme1":"OnDemand","duration":"3040","broadcastMode":"clip"}}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://mp3podcasthr-a.akamaihd.net/mp3/podcast/derTag/derTag_20190320_81142988.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":3040,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Muslim Fashion. Mehr als ein Kopftuch.","synopsis":"Wo immer die Ausstellung \"Contemporary Muslim Fashion“ ins Museum kommt, entfacht sie heftige Diskussionen. Nachdem die Schau in San Francisco für Furore sorgte, wird sie demnächst im Frankfurter Museum für Angewandte Kunst als erste Station in Europa gezeigt. Die \"Modest Fashion“, die dezente Mode, so das Schlagwort für die verhüllende, aber keineswegs unsichtbar machende Mode, spaltet das feministische Lager: Ist sie eine Momentaufnahme aktueller muslimischer Kleidungsstile aus aller Welt oder Werbung für die weibliche Verschleierung? In jedem Fall zeigt die Ausstellung, dass die Verhüllung des weiblichen Körpers und der Frisur nicht nur trist, sondern auch schön sein kann - und für manche Trägerinnen befreiend. Und sie ist durchaus politisch, diskutiert gesetzliche Kleiderordnungen und die Frage politischer Symbolik. Inzwischen wollen auch westliche Firmen von der Vielfalt muslimischer Mode profitieren. Sie haben die Konsumentinnen im Nahen Osten und Südostasien als kaufkräftige Klientel entdeckt. Dort ist ein riesiger Markt zu erschließen. Nicht selten wagen sie sich damit an die Grenzen religiöser und gesellschaftlicher Akzeptanz. Kann Mode solche Grenzen überwinden? "},"pluginData":{},"geoBlocked":false},"playerId":"4076","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.4fc164e9.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.8ea4ea3d.js","isAutoplay":true,"teaserSize":"50"}}}},"link":{"url":"/teaser1","webviewUrl":"/teaser1#webview","isTargetBlank":false,"hasIcon":false,"iconName":"iconName","readMoreText":{"readMoreScreenreader":"Zum Artikel","readMore":"mehr","readMoreLong":"read More Long"}},"label":{"type":"podcast","loca":"label_podcast","byline":{"bylineSsi":"53:13 min","bylineText":""}}},{"byline":"Byline","title":"Verurteilt! (73) - Der Todes-Drift","topline":"","headingFontVariant":"serif","extendedTitle":"","teaserType":"standard-ds","teaserSize":"100","isMobile1to1":false,"airdateDate":{"htmlDateTime":"2022-10-31T19:30+0200","htmlDate":"31.10.2022","date":"07.09.22","dateSeparatorTime":"31.10.22, 19:30"},"teaseritem":{"copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/heiner-goebbels-102_v-1to1__medium.jpg","sources":[{"sizes":"300px","srcset":"images/heiner-goebbels-102_v-1to1__small.jpg 380w, images/heiner-goebbels-102_v-1to1__medium.jpg 480w, images/heiner-goebbels-102_v-1to1.jpg 720w, images/heiner-goebbels-102_v-1to1__large.jpg 960w"}]}},"podcastDuration":"70:26","teaserInfo":{"showTeaserInfo":true,"showTeaserInfoSection":true,"showTeaserInfoChannel":true,"showTeaserInfoAll":true,"showTeaserInfoDate":false,"showTeaserInfoDateTime":true,"showTeaserInfoProgramRef":true},"podcastChannel":{"title":"hr2 Doppelkopf","url":"#ChannelURL","podcastHoster":[{"podcastHosterUrl":"https://podcasts.apple.com/podcast/hr2-doppelkopf/id212822590","podcastHosterName":"ITunes"},{"podcastHosterUrl":"https://podcast.hr.de/hr2_doppelkopf/podcast.xml","podcastHosterName":"RSS"},{"podcastHosterUrl":"https://podcasts.google.com/feed/aHR0cHM6Ly9wb2RjYXN0LmhyLmRlL2hyMl9kb3BwZWxrb3BmL3BvZGNhc3QueG1s?hl=de","podcastHosterName":"Google Podcasts"},{"podcastHosterUrl":"https://www.ardaudiothek.de/episode/hr2-doppelkopf/ich-hoere-bei-jedem-geraeusch-gleich-die-tonhoehe-oder-komponist-und-theatermacher-heiner-goebbels-erneuert-das-musiktheater/hr2-kultur/12056783/","podcastHosterName":"ARD Audiothek"}]},"audioUrl":"https://mp3podcasthr-a.akamaihd.net/mp3/podcast/verurteilt/verurteilt_20220907_95686133.mp3","podcastDownloadUrl":"https://mp3podcasthrdl-a.akamaihd.net/mp3/podcast/hr2_doppelkopf/hr2_doppelkopf_20221031_96251016.mp3","teaserImage":{"copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/heiner-goebbels-102_v-1to1__medium.jpg","sources":[{"sizes":"300px","srcset":"images/heiner-goebbels-102_v-1to1__small.jpg 380w, images/heiner-goebbels-102_v-1to1__medium.jpg 480w, images/heiner-goebbels-102_v-1to1.jpg 720w, images/heiner-goebbels-102_v-1to1__large.jpg 960w"}]}},"documentSection":"Kultur","displayTeaserBodyAsImageOverlay":false,"hasMediaButtons":false,"dontLazyload":true,"isStandardTeaser":false,"isHeroTeaser":true,"isMediaTeaser":false,"isGuide":false,"isProgram":false,"isEvent":false,"isTicker":false,"isAudio":false,"isVideo":false,"isPodcastEpisode":true,"isExtOrBrandLink":false,"isAuthor":false,"copyright":"Copyright Text","audioAuthor":"Stefan Fricke","hasStatus":false,"hasTeaserItem":true,"allowAVConsumption":false,"displayEpgInfos":false,"aspectRatio":"ar--teaserTop","hideGeotag":false,"hideEditableByline":true,"doTracking":true,"trackingForArdMediatheksLink":false,"showMediatheksLink":false,"showAirdate":true,"showProfileInfoAsByline":false,"obsolet_brandOfTeaser":"hessenschau","headlineTag":"h2","icon":"ortsmarke","imageVariant":"topteaser","hideShortText":false,"shorttext":"Bla ..... Vor einem Jahr wurde die syrische Familie Kheder aus Wolfhagen abgeschoben. Die Gemeinde setzte alle Hebel in Bewegung, um Mutter, Tochter und Sohn zurückzuholen. Im Fall der Kinder hat das nun zu einem Happy End geführt. Doch ihre liebe Mutter fehlt.","sophoraId":"rueckkehr-nach-abschiebung-wolfhagen--100","profiles":"Von Alf Haubitz und Alice Merton","teaserLead":{"isPodcast":true,"toModel":{"audioElement":{"isPodcast":true,"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"http://localhost:8080/site/hessenschau/assets_2.85.0/vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"site":"551103","config":{"getCollectDomainSSL":"logs1406.xiti.com","secure":true},"page":{"name":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audio:audioPlay","level2":"4","chapter1":"Audio-Start","chapter2":"OnDemand","customVars":{"site":{"1":"podcast-episode-43976","2":"hr-nt:podcastEpisode","5":"202203230802"}}},"richMedia":{"mediaType":"audio","playerId":"4076","mediaLevel2":"4","mediaLabel":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audioPlay","mediaTheme1":"OnDemand","duration":"3040","broadcastMode":"clip"}}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://mp3podcasthr-a.akamaihd.net/mp3/podcast/derTag/derTag_20190320_81142988.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":3040,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Muslim Fashion. Mehr als ein Kopftuch.","synopsis":"Wo immer die Ausstellung \"Contemporary Muslim Fashion“ ins Museum kommt, entfacht sie heftige Diskussionen. Nachdem die Schau in San Francisco für Furore sorgte, wird sie demnächst im Frankfurter Museum für Angewandte Kunst als erste Station in Europa gezeigt. Die \"Modest Fashion“, die dezente Mode, so das Schlagwort für die verhüllende, aber keineswegs unsichtbar machende Mode, spaltet das feministische Lager: Ist sie eine Momentaufnahme aktueller muslimischer Kleidungsstile aus aller Welt oder Werbung für die weibliche Verschleierung? In jedem Fall zeigt die Ausstellung, dass die Verhüllung des weiblichen Körpers und der Frisur nicht nur trist, sondern auch schön sein kann - und für manche Trägerinnen befreiend. Und sie ist durchaus politisch, diskutiert gesetzliche Kleiderordnungen und die Frage politischer Symbolik. Inzwischen wollen auch westliche Firmen von der Vielfalt muslimischer Mode profitieren. Sie haben die Konsumentinnen im Nahen Osten und Südostasien als kaufkräftige Klientel entdeckt. Dort ist ein riesiger Markt zu erschließen. Nicht selten wagen sie sich damit an die Grenzen religiöser und gesellschaftlicher Akzeptanz. Kann Mode solche Grenzen überwinden? "},"pluginData":{},"geoBlocked":false},"playerId":"4076","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.4fc164e9.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.8ea4ea3d.js","isAutoplay":true,"teaserSize":"50"},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"http://localhost:8080/site/hessenschau/assets_2.85.0/vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"site":"551103","config":{"getCollectDomainSSL":"logs1406.xiti.com","secure":true},"page":{"name":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audio:audioPlay","level2":"4","chapter1":"Audio-Start","chapter2":"OnDemand","customVars":{"site":{"1":"podcast-episode-43976","2":"hr-nt:podcastEpisode","5":"202203230802"}}},"richMedia":{"mediaType":"audio","playerId":"4076","mediaLevel2":"4","mediaLabel":"muslim_fashion__mehr_als_ein_kopftuch__podcast:audioPlay","mediaTheme1":"OnDemand","duration":"3040","broadcastMode":"clip"}}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://mp3podcasthr-a.akamaihd.net/mp3/podcast/derTag/derTag_20190320_81142988.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":3040,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Muslim Fashion. Mehr als ein Kopftuch.","synopsis":"Wo immer die Ausstellung \"Contemporary Muslim Fashion“ ins Museum kommt, entfacht sie heftige Diskussionen. Nachdem die Schau in San Francisco für Furore sorgte, wird sie demnächst im Frankfurter Museum für Angewandte Kunst als erste Station in Europa gezeigt. Die \"Modest Fashion“, die dezente Mode, so das Schlagwort für die verhüllende, aber keineswegs unsichtbar machende Mode, spaltet das feministische Lager: Ist sie eine Momentaufnahme aktueller muslimischer Kleidungsstile aus aller Welt oder Werbung für die weibliche Verschleierung? In jedem Fall zeigt die Ausstellung, dass die Verhüllung des weiblichen Körpers und der Frisur nicht nur trist, sondern auch schön sein kann - und für manche Trägerinnen befreiend. Und sie ist durchaus politisch, diskutiert gesetzliche Kleiderordnungen und die Frage politischer Symbolik. Inzwischen wollen auch westliche Firmen von der Vielfalt muslimischer Mode profitieren. Sie haben die Konsumentinnen im Nahen Osten und Südostasien als kaufkräftige Klientel entdeckt. Dort ist ein riesiger Markt zu erschließen. Nicht selten wagen sie sich damit an die Grenzen religiöser und gesellschaftlicher Akzeptanz. Kann Mode solche Grenzen überwinden? "},"pluginData":{},"geoBlocked":false},"playerId":"4076","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.4fc164e9.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.3.4.8ea4ea3d.js","isAutoplay":true,"teaserSize":"50"}}}},"link":{"url":"/teaser1","webviewUrl":"/teaser1#webview","isTargetBlank":false,"hasIcon":false,"iconName":"iconName","readMoreText":{"readMoreScreenreader":"Zum Artikel","readMore":"mehr","readMoreLong":"read More Long"}},"label":{"type":"podcast","loca":"label_podcast","byline":{"bylineSsi":"53:13 min","bylineText":""}}}],"label":{"type":"podcast","loca":"label_podcast","byline":{"bylineSsi":"07:42 min","bylineText":""}},"hideShortText":false,"shorttext":"Der Podcast für alle, die sich täglich in sozialen Netzwerken bewegen. Wir geben euch einen Einblick, was hinter den Kulissen einer Social-Media-Redaktion passiert, diskutieren Trends, Shitstorms und warum gewisse Posts funktionieren - und andere nicht.","teaseritem":{"copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/aufmacher-im-haifischbecken-100_v-1to1__medium.jpg","sources":[{"sizes":"300px","srcset":"images/aufmacher-im-haifischbecken-100_v-1to1__small.jpg 380w, images/aufmacher-im-haifischbecken-100_v-1to1__medium.jpg 480w, images/aufmacher-im-haifischbecken-100_v-1to1.jpg 720w, images/aufmacher-im-haifischbecken-100_v-1to1__large.jpg 960w"}]}},"podcastChannel":{"title":"Der Tag in Hessen!","url":"#ChannelURL","podcastHoster":[{"podcastHosterUrl":"https://itunes.apple.com/de/podcast/hr-info-der-tag-in-hessen/id273944140?mt=2","podcastHosterName":"ITunes Podcast"},{"podcastHosterUrl":"https://podcast.hr.de/der_tag_in_hessen/podcast.xml","podcastHosterName":"RSS-Feed"},{"podcastHosterUrl":"https://podcasts.google.com/feed/aHR0cHM6Ly9wb2RjYXN0LmhyLmRlL2Rlcl90YWdfaW5faGVzc2VuL3BvZGNhc3QueG1s?hl=de","podcastHosterName":"Google Podcasts"},{"podcastHosterUrl":"https://www.ardaudiothek.de/sendung/der-tag-ein-thema-viele-perspektiven/470522/","podcastHosterName":"ARD Audiothek"}]},"audioUrl":"https://mp3podcasthr-a.akamaihd.net/mp3/podcast/hr2_audio/hr2_audio_20220914_95730396.mp3","podcastDownloadUrl":"https://mp3podcasthr-a.akamaihd.net/mp3/podcast/derTag/derTag_20190320_81142988.mp3","link":{"url":"/teaser1","webviewUrl":"/teaser1#webview","isTargetBlank":false,"hasIcon":false,"iconName":"iconName","readMoreText":{"readMoreScreenreader":"Zum Artikel","readMore":"mehr","readMoreLong":"read More Long"}}}}}
package/src/stories/views/components/teaser/podcast/podcast-playlist.hbs CHANGED
@@ -1,3 +1,4 @@
1
- <div class="grid grid-cols-12 pt-5 mx-0 md:pt-5 bg-blue-accented rounded-tl-3xl rounded-br-3xl col-main gap-x-6 gap-y-6" >
2
- {{> components/teaser/podcast/podcast_playlist_player _linkTitle="true" _isSinglePage=false _type="podcastPlaylistPlayerTeaser" }}
3
- </div>
1
+
2
+ <div id="4" class="grid gap-y-6 relative gap-x-4 flex-col pt-5 mx-0 md:pt-5 bg-blue-accented rounded-tl-3xl rounded-br-3xl col-span-12 {{~inline-switch this.teaserSize '["50","100"]' '[" md:col-span-6",""]'}}" >
3
+ {{> components/teaser/podcast/podcast_playlist_player _linkTitle="true" _isSinglePage=false _type="podcastPlaylistPlayerTeaser" }}
4
+ </div>
package/src/stories/views/components/teaser/podcast/podcast.hbs CHANGED
@@ -1,3 +1,3 @@
1
- <div class="grid grid-cols-12 pt-5 mx-0 md:pt-5 bg-blue-accented rounded-tl-3xl rounded-br-3xl col-main gap-x-6 gap-y-6" >
1
+ <div class="grid gap-y-6 relative gap-x-4 flex-col pt-5 mx-0 md:pt-5 bg-blue-accented rounded-tl-3xl rounded-br-3xl col-span-12 {{~inline-switch this.teaserSize '["50","100"]' '[" md:col-span-6",""]'}}" >
2
2
  {{> components/teaser/podcast/podcast_player _linkTitle="true" _isSinglePage=true _type="podcastEpisodePlayerTeaser" }}
3
- </div>
3
+ </div>
package/src/stories/views/components/teaser/podcast/podcast.stories.mdx CHANGED
@@ -3,7 +3,8 @@ import { ArgsTable, Meta, Story, Canvas, Preview } from '@storybook/addon-docs'
3
3
  import podcast from './podcast.hbs'
4
4
  import podcastPlaylist from './podcast-playlist.hbs'
5
5
  import episodeJson from '../fixtures/teaser_podcast.json'
6
- import playlistJson from '../fixtures/teaser_podcast_playlist.json'
6
+ import playlistJson100 from '../fixtures/teaser_podcast_playlist.json'
7
+ import playlistJson50 from '../fixtures/teaser_podcast_playlist_50.json'
7
8
 
8
9
  <Meta title="Komponenten/Teaser/Podcast"
9
10
  parameters={{
@@ -16,13 +17,14 @@ import playlistJson from '../fixtures/teaser_podcast_playlist.json'
16
17
  }}
17
18
  decorators={[
18
19
  (Story) => {
19
- return `<div class="grid my-5 grid-page">
20
-
21
- ${Story()}
22
-
20
+ return `<div id="1" class="grid grid-page">
21
+ <div id="2" class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
22
+ ${Story()}
23
+ </div>
23
24
  </div>`
24
- },
25
- ]}
25
+ }
26
+
27
+ ]}
26
28
  />
27
29
 
28
30
  export const episodeTemplate = (args, { globals: { customConditionalToolbar } }) => {
@@ -46,7 +48,10 @@ export const playlistTemplate = (args, { globals: { customConditionalToolbar } }
46
48
  <Story name="100% Episode Player" args={episodeJson.logicItem.includeModel}>
47
49
  {episodeTemplate.bind({})}
48
50
  </Story>
49
- <Story name="100% Channel Player" args={playlistJson.logicItem.includeModel}>
51
+ <Story name="100% Channel Player" args={playlistJson100.logicItem.includeModel}>
52
+ {playlistTemplate.bind({})}
53
+ </Story>
54
+ <Story name="50% Channel Player" args={playlistJson50.logicItem.includeModel}>
50
55
  {playlistTemplate.bind({})}
51
56
  </Story>
52
57
  </Preview>
package/src/stories/views/components/teaser/teaser_alternativ.hbs CHANGED
@@ -5,7 +5,7 @@
5
5
  {{/if}}
6
6
  >
7
7
  <figure class="relative {{~inline-switch this.teaserSize '["hero","100","50"]' '[" basis-2/3 ar-16-9"," ar-1-1 md:ar-16-9 basis-2/5 md:basis-1/3"," ar-1-1 md:ar-16-9 basis-2/5 md:basis-1/2"]'~}}">
8
- {{> components/teaser/components/teaser_lead _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _aspectRatio=(inline-switch this.teaserSize '["hero"]' '["ar-16-9","ar-1-1 md:ar-16-9"]') }}
8
+ {{> components/teaser/components/teaser_lead _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _teaserType=this.teaserType _aspectRatio=(inline-switch this.teaserSize '["hero"]' '["ar-16-9","ar-1-1 md:ar-16-9"]') }}
9
9
  </figure>
10
10
  {{> components/teaser/components/teaser_body _outerCssClasses=(inline-switch this.teaserSize '["hero","100","50"]' '["basis-1/3"," basis-3/5 md:basis-2/3"," basis-3/5 md:basis-1/2"]') }}
11
11
  </article>
package/src/stories/views/components/teaser/teaser_standard.hbs CHANGED
@@ -9,11 +9,11 @@
9
9
  >
10
10
  <figure class="relative
11
11
  {{~#if this.isMobile1to1}} basis-2/5 md:flex-full ar-1-1 md:ar-16-9{{else}} ar-16-9{{/if~}}">
12
- {{> components/teaser/components/teaser_lead _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _aspectRatio=(inline-switch this.teaserSize '["25"]' '["ar-1-1 md:ar-16-9", "ar-16-9"]') }}
12
+ {{> components/teaser/components/teaser_lead _isMobile1to1=this.isMobile1to1 _teaserSize=this.teaserSize _teaserType=this.teaserType _aspectRatio=(inline-switch this.teaserSize '["25"]' '["ar-1-1 md:ar-16-9", "ar-16-9"]') }}
13
13
  </figure>
14
14
  {{#if this.displayTeaserBodyAsImageOverlay}}
15
15
  {{#decorator 'components/teaser/components/teaser_image_overlay' _noOverlayInMobileViewports=true _cssClasses=" relative md:absolute w-full bottom-0"}}
16
- <div class="flex flex-col items-center justify-center p-4 border-dashed border-r border-gray-400">
16
+ <div class="flex flex-col items-center justify-center p-4 border-r border-gray-400 border-dashed">
17
17
  {{> components/event/instant_dates}}
18
18
  </div>
19
19
  {{> components/teaser/components/teaser_body _outerCssClasses=(if this.isMobile1to1 'py-4 md:px-4 basis-3/5 md:flex-full' 'py-4 md:px-4')}}