hr-design-system-handlebars 0.95.0 → 0.95.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +24 -0
- package/dist/assets/index.css +3 -3
- package/dist/views/components/teaser/podcast/podcast_player.hbs +1 -1
- package/dist/views/components/teaser/podcast/podcast_playlist_player.hbs +43 -47
- package/package.json +1 -1
- package/src/stories/views/components/teaser/podcast/podcast_player.hbs +1 -1
- package/src/stories/views/components/teaser/podcast/podcast_playlist_player.hbs +43 -47
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,27 @@
|
|
|
1
|
+
# v0.95.2 (Thu Dec 01 2022)
|
|
2
|
+
|
|
3
|
+
#### 🐛 Bug Fix
|
|
4
|
+
|
|
5
|
+
- podcast channel link needs self-end to be adjusted to the right [#410](https://github.com/mumprod/hr-design-system-handlebars/pull/410) ([@vascoeduardo](https://github.com/vascoeduardo))
|
|
6
|
+
|
|
7
|
+
#### Authors: 1
|
|
8
|
+
|
|
9
|
+
- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
13
|
+
# v0.95.1 (Thu Dec 01 2022)
|
|
14
|
+
|
|
15
|
+
#### 🐛 Bug Fix
|
|
16
|
+
|
|
17
|
+
- -fixed closing div bug in podcast_playlist_player.hbs [#409](https://github.com/mumprod/hr-design-system-handlebars/pull/409) ([@vascoeduardo](https://github.com/vascoeduardo))
|
|
18
|
+
|
|
19
|
+
#### Authors: 1
|
|
20
|
+
|
|
21
|
+
- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
|
|
22
|
+
|
|
23
|
+
---
|
|
24
|
+
|
|
1
25
|
# v0.95.0 (Thu Dec 01 2022)
|
|
2
26
|
|
|
3
27
|
#### 🚀 Enhancement
|
package/dist/assets/index.css
CHANGED
|
@@ -2259,7 +2259,7 @@ video {
|
|
|
2259
2259
|
transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
|
|
2260
2260
|
}
|
|
2261
2261
|
.counter-reset {
|
|
2262
|
-
counter-reset:
|
|
2262
|
+
counter-reset: cnt1669905469126;
|
|
2263
2263
|
}
|
|
2264
2264
|
.line-clamp-4 {
|
|
2265
2265
|
overflow: hidden;
|
|
@@ -2645,7 +2645,7 @@ video {
|
|
|
2645
2645
|
--tw-ring-color: rgba(255, 255, 255, 0.5);
|
|
2646
2646
|
}
|
|
2647
2647
|
.-ordered {
|
|
2648
|
-
counter-increment:
|
|
2648
|
+
counter-increment: cnt1669905469126 1;
|
|
2649
2649
|
}
|
|
2650
2650
|
.-ordered::before {
|
|
2651
2651
|
position: absolute;
|
|
@@ -2661,7 +2661,7 @@ video {
|
|
|
2661
2661
|
letter-spacing: .0125em;
|
|
2662
2662
|
--tw-text-opacity: 1;
|
|
2663
2663
|
color: rgba(0, 0, 0, var(--tw-text-opacity));
|
|
2664
|
-
content: counter(
|
|
2664
|
+
content: counter(cnt1669905469126);
|
|
2665
2665
|
}
|
|
2666
2666
|
.\[-T\:\+Z\] {
|
|
2667
2667
|
--t: +Z;
|
|
@@ -74,7 +74,7 @@
|
|
|
74
74
|
<div class="flex justify-end w-full pl-4">
|
|
75
75
|
<div class="flex flex-col flex-wrap self-end text-xs font-heading text-blue-science">
|
|
76
76
|
<span class="self-end font-bold">Zur Sendung</span>
|
|
77
|
-
<a class="underline" href="{{this.url}}">{{this.title}}</a>
|
|
77
|
+
<a class="self-end underline" href="{{this.url}}">{{this.title}}</a>
|
|
78
78
|
</div>
|
|
79
79
|
</div>
|
|
80
80
|
{{/with}}
|
|
@@ -1,83 +1,79 @@
|
|
|
1
|
-
<div class="flex col-span-12 pb-5 border-b border-white"
|
|
1
|
+
<div class="flex col-span-12 pb-5 border-b border-white">
|
|
2
2
|
<div class="flex flex-col grow">
|
|
3
|
-
|
|
3
|
+
{{!-- First Row --}}
|
|
4
4
|
<div class="flex flex-row px-5 md:pl-5 {{#if ../_ordered}} pl-8 {{/if}} ">
|
|
5
|
-
|
|
6
5
|
<div class="flex flex-col pr-5 grow">
|
|
7
|
-
|
|
8
6
|
<div class="flex max-h-6">
|
|
9
7
|
{{!-- Label / Airdate --}}
|
|
10
|
-
{{#with label}}
|
|
11
|
-
<span
|
|
8
|
+
{{#with label}}
|
|
9
|
+
<span
|
|
10
|
+
class='sb-label mr-2 rounded px-1.5 pt-px inline-block tracking-wide text-white text-base leading-5.5 font-heading bg-labelMedia'>
|
|
12
11
|
{{ loca this.loca }}
|
|
13
|
-
</span>
|
|
12
|
+
</span>
|
|
14
13
|
{{/with}}
|
|
15
14
|
</div>
|
|
16
15
|
|
|
17
16
|
{{!-- Überschrift: --}}
|
|
18
|
-
<div class="flex pb-5 pr-2 md:pr-5">
|
|
19
|
-
{{> components/teaser/podcast/podcast_title _title=this.title _teaserSize=this.teaserSize _addClass="" }}
|
|
17
|
+
<div class="flex pb-5 pr-2 md:pr-5">
|
|
18
|
+
{{> components/teaser/podcast/podcast_title _title=this.title _teaserSize=this.teaserSize _addClass="" }}
|
|
20
19
|
</div>
|
|
21
20
|
|
|
22
21
|
{{!-- Shorttext --}}
|
|
23
22
|
{{#unless _isSinglePage}}
|
|
24
23
|
{{#unless this.hideShortText}}
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
24
|
+
{{~#with this.shorttext}}
|
|
25
|
+
<div class="hidden pb-6 text-sm md:flex md:text-base font-copy">
|
|
26
|
+
<span class="c-teaser__shorttext"> {{this}} </span>
|
|
27
|
+
</div>
|
|
28
|
+
{{/with~}}
|
|
30
29
|
{{/unless}}
|
|
31
30
|
{{/unless}}
|
|
32
31
|
|
|
33
32
|
</div>
|
|
34
33
|
|
|
35
|
-
{{!-- Podcast Image
|
|
34
|
+
{{!-- Podcast Image --}}
|
|
36
35
|
<div class="flex flex-col ">
|
|
37
36
|
<div class="w-24 md:w-42">
|
|
38
|
-
{{> components/base/image/responsive_image this.teaseritem
|
|
37
|
+
{{> components/base/image/responsive_image this.teaseritem
|
|
39
38
|
_type="podcastEpisodePlayer"
|
|
40
39
|
_variant="default"
|
|
41
40
|
_addClass="overflow-hidden"
|
|
42
|
-
_noDelay=this.dontLazyload
|
|
41
|
+
_noDelay=this.dontLazyload
|
|
43
42
|
_addClassImg="w-full h-24 md:h-42 block"
|
|
44
43
|
}}
|
|
45
44
|
</div>
|
|
46
45
|
</div>
|
|
47
46
|
|
|
48
47
|
</div>
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
{{#with this.podcastChannel}}
|
|
48
|
+
{{!-- Abo-Dropdown --}}
|
|
49
|
+
|
|
50
|
+
{{#with this.podcastChannel}}
|
|
51
|
+
<div class="flex flex-row px-5 md:pr-0">
|
|
54
52
|
{{> components/teaser/podcast/podcast_subscribe_button}}
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
</div>
|
|
53
|
+
</div>
|
|
54
|
+
{{/with}}
|
|
58
55
|
|
|
59
|
-
</div>
|
|
56
|
+
</div>
|
|
60
57
|
</div>
|
|
61
58
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
</div>
|
|
59
|
+
{{!-- Player UI --}}
|
|
60
|
+
<div class="flex flex-col col-span-12 gap-5 px-5"
|
|
61
|
+
x-data="playaudio()"
|
|
62
|
+
x-init="listenToGlobalStop()"
|
|
63
|
+
ax-load
|
|
64
|
+
x-ignore
|
|
65
|
+
ax-load-src={{resourceUrl "assets/js/vendor/podcast_player.alpine.js" }}>
|
|
66
|
+
{{#with this.playlistItems}}
|
|
67
|
+
{{#each this}}
|
|
68
|
+
<div class="flex pb-5 {{#unless @last}}border-white border-b{{/unless}}">
|
|
69
|
+
{{> components/teaser/podcast/podcast_player_ui
|
|
70
|
+
_isPlaylistPlayer=true
|
|
71
|
+
_podcastDuration=duration
|
|
72
|
+
_title=title
|
|
73
|
+
_id=(nextRandom)
|
|
74
|
+
_first=@first
|
|
75
|
+
}}
|
|
76
|
+
</div>
|
|
77
|
+
{{/each}}
|
|
78
|
+
{{/with}}
|
|
83
79
|
</div>
|
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.95.
|
|
9
|
+
"version": "0.95.2",
|
|
10
10
|
"scripts": {
|
|
11
11
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
12
12
|
"storybook": "start-storybook -p 6006 public",
|
|
@@ -74,7 +74,7 @@
|
|
|
74
74
|
<div class="flex justify-end w-full pl-4">
|
|
75
75
|
<div class="flex flex-col flex-wrap self-end text-xs font-heading text-blue-science">
|
|
76
76
|
<span class="self-end font-bold">Zur Sendung</span>
|
|
77
|
-
<a class="underline" href="{{this.url}}">{{this.title}}</a>
|
|
77
|
+
<a class="self-end underline" href="{{this.url}}">{{this.title}}</a>
|
|
78
78
|
</div>
|
|
79
79
|
</div>
|
|
80
80
|
{{/with}}
|
|
@@ -1,83 +1,79 @@
|
|
|
1
|
-
<div class="flex col-span-12 pb-5 border-b border-white"
|
|
1
|
+
<div class="flex col-span-12 pb-5 border-b border-white">
|
|
2
2
|
<div class="flex flex-col grow">
|
|
3
|
-
|
|
3
|
+
{{!-- First Row --}}
|
|
4
4
|
<div class="flex flex-row px-5 md:pl-5 {{#if ../_ordered}} pl-8 {{/if}} ">
|
|
5
|
-
|
|
6
5
|
<div class="flex flex-col pr-5 grow">
|
|
7
|
-
|
|
8
6
|
<div class="flex max-h-6">
|
|
9
7
|
{{!-- Label / Airdate --}}
|
|
10
|
-
{{#with label}}
|
|
11
|
-
<span
|
|
8
|
+
{{#with label}}
|
|
9
|
+
<span
|
|
10
|
+
class='sb-label mr-2 rounded px-1.5 pt-px inline-block tracking-wide text-white text-base leading-5.5 font-heading bg-labelMedia'>
|
|
12
11
|
{{ loca this.loca }}
|
|
13
|
-
</span>
|
|
12
|
+
</span>
|
|
14
13
|
{{/with}}
|
|
15
14
|
</div>
|
|
16
15
|
|
|
17
16
|
{{!-- Überschrift: --}}
|
|
18
|
-
<div class="flex pb-5 pr-2 md:pr-5">
|
|
19
|
-
{{> components/teaser/podcast/podcast_title _title=this.title _teaserSize=this.teaserSize _addClass="" }}
|
|
17
|
+
<div class="flex pb-5 pr-2 md:pr-5">
|
|
18
|
+
{{> components/teaser/podcast/podcast_title _title=this.title _teaserSize=this.teaserSize _addClass="" }}
|
|
20
19
|
</div>
|
|
21
20
|
|
|
22
21
|
{{!-- Shorttext --}}
|
|
23
22
|
{{#unless _isSinglePage}}
|
|
24
23
|
{{#unless this.hideShortText}}
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
24
|
+
{{~#with this.shorttext}}
|
|
25
|
+
<div class="hidden pb-6 text-sm md:flex md:text-base font-copy">
|
|
26
|
+
<span class="c-teaser__shorttext"> {{this}} </span>
|
|
27
|
+
</div>
|
|
28
|
+
{{/with~}}
|
|
30
29
|
{{/unless}}
|
|
31
30
|
{{/unless}}
|
|
32
31
|
|
|
33
32
|
</div>
|
|
34
33
|
|
|
35
|
-
{{!-- Podcast Image
|
|
34
|
+
{{!-- Podcast Image --}}
|
|
36
35
|
<div class="flex flex-col ">
|
|
37
36
|
<div class="w-24 md:w-42">
|
|
38
|
-
{{> components/base/image/responsive_image this.teaseritem
|
|
37
|
+
{{> components/base/image/responsive_image this.teaseritem
|
|
39
38
|
_type="podcastEpisodePlayer"
|
|
40
39
|
_variant="default"
|
|
41
40
|
_addClass="overflow-hidden"
|
|
42
|
-
_noDelay=this.dontLazyload
|
|
41
|
+
_noDelay=this.dontLazyload
|
|
43
42
|
_addClassImg="w-full h-24 md:h-42 block"
|
|
44
43
|
}}
|
|
45
44
|
</div>
|
|
46
45
|
</div>
|
|
47
46
|
|
|
48
47
|
</div>
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
{{#with this.podcastChannel}}
|
|
48
|
+
{{!-- Abo-Dropdown --}}
|
|
49
|
+
|
|
50
|
+
{{#with this.podcastChannel}}
|
|
51
|
+
<div class="flex flex-row px-5 md:pr-0">
|
|
54
52
|
{{> components/teaser/podcast/podcast_subscribe_button}}
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
</div>
|
|
53
|
+
</div>
|
|
54
|
+
{{/with}}
|
|
58
55
|
|
|
59
|
-
</div>
|
|
56
|
+
</div>
|
|
60
57
|
</div>
|
|
61
58
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
</div>
|
|
59
|
+
{{!-- Player UI --}}
|
|
60
|
+
<div class="flex flex-col col-span-12 gap-5 px-5"
|
|
61
|
+
x-data="playaudio()"
|
|
62
|
+
x-init="listenToGlobalStop()"
|
|
63
|
+
ax-load
|
|
64
|
+
x-ignore
|
|
65
|
+
ax-load-src={{resourceUrl "assets/js/vendor/podcast_player.alpine.js" }}>
|
|
66
|
+
{{#with this.playlistItems}}
|
|
67
|
+
{{#each this}}
|
|
68
|
+
<div class="flex pb-5 {{#unless @last}}border-white border-b{{/unless}}">
|
|
69
|
+
{{> components/teaser/podcast/podcast_player_ui
|
|
70
|
+
_isPlaylistPlayer=true
|
|
71
|
+
_podcastDuration=duration
|
|
72
|
+
_title=title
|
|
73
|
+
_id=(nextRandom)
|
|
74
|
+
_first=@first
|
|
75
|
+
}}
|
|
76
|
+
</div>
|
|
77
|
+
{{/each}}
|
|
78
|
+
{{/with}}
|
|
83
79
|
</div>
|