hr-design-system-handlebars 1.30.2 → 1.31.0
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/brand/hr4/icons/logo/brandlogo--mobile.min.svg +1 -1
- package/dist/assets/brand/hr4/icons/logo/svgmap/brandlogo--mobile.svg +23 -19
- package/dist/assets/index.css +35 -14
- package/dist/assets/js/base/tracking/pianoHelper.subfeature.js +44 -0
- package/dist/assets/vendor/js/podcast_player.alpine.js +98 -0
- package/dist/views/components/teaser/podcast/podcast_player_ui.hbs +8 -7
- package/package.json +1 -1
- package/src/assets/brand/hr4/icons/logo/brandlogo--mobile.min.svg +1 -1
- package/src/assets/brand/hr4/icons/logo/svgmap/brandlogo--mobile.svg +23 -19
- package/src/assets/fixtures/teaser/teasers.inc.json +46 -0
- package/src/assets/tailwind.css +32 -11
- package/src/assets/vendor/js/podcast_player.alpine.js +98 -0
- package/src/stories/views/base/tracking/pianoHelper.subfeature.js +44 -0
- package/src/stories/views/components/teaser/fixtures/teaser_podcast.json +1 -1
- package/src/stories/views/components/teaser/fixtures/teaser_podcast_50.json +1 -1
- package/src/stories/views/components/teaser/fixtures/teaser_podcast_playlist.json +1 -1
- package/src/stories/views/components/teaser/fixtures/teaser_podcast_playlist_50.json +1 -1
- package/src/stories/views/components/teaser/podcast/podcast_player_ui.hbs +8 -7
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,27 @@
|
|
|
1
|
+
# v1.31.0 (Thu Jul 13 2023)
|
|
2
|
+
|
|
3
|
+
#### 🚀 Enhancement
|
|
4
|
+
|
|
5
|
+
- Feature/dpe 2396 [#677](https://github.com/mumprod/hr-design-system-handlebars/pull/677) ([@szuelch](https://github.com/szuelch))
|
|
6
|
+
|
|
7
|
+
#### Authors: 1
|
|
8
|
+
|
|
9
|
+
- [@szuelch](https://github.com/szuelch)
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
13
|
+
# v1.30.3 (Wed Jul 12 2023)
|
|
14
|
+
|
|
15
|
+
#### 🐛 Bug Fix
|
|
16
|
+
|
|
17
|
+
- some fixes on logo padding [#676](https://github.com/mumprod/hr-design-system-handlebars/pull/676) ([@StefanVesper](https://github.com/StefanVesper))
|
|
18
|
+
|
|
19
|
+
#### Authors: 1
|
|
20
|
+
|
|
21
|
+
- SonicSoulSurfer ([@StefanVesper](https://github.com/StefanVesper))
|
|
22
|
+
|
|
23
|
+
---
|
|
24
|
+
|
|
1
25
|
# v1.30.2 (Tue Jul 11 2023)
|
|
2
26
|
|
|
3
27
|
#### 🐛 Bug Fix
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg
|
|
1
|
+
<svg id="Ebene_2" data-name="Ebene 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 62 62" preserveAspectRatio="xMinYMid meet"><defs><linearGradient id="Unbenannter_Verlauf" data-name="Unbenannter Verlauf" x1="51.64" y1="171.64" x2="12.95" y2="132.95" gradientTransform="matrix(1 0 0 -1 0 182)" gradientUnits="userSpaceOnUse"><stop offset=".03" stop-color="#d6007f"/><stop offset=".48" stop-color="#9b0058"/></linearGradient><style>.cls-1{fill:#fff}</style></defs><path d="M50 62H0V12C0 5.4 5.4 0 12 0h50v50c0 6.6-5.4 12-12 12Z" style="fill:url(#Unbenannter_Verlauf)"/><g><path class="cls-1" d="M30.36 47.41c-7.14.11-15.75-1.18-21.36-3.54v-2.14c5.86 2.46 13.86 3.75 20.96 3.64 7.68-.14 15.68-1.39 21.21-3.57v2.07c-6.14 2.18-13.18 3.39-20.82 3.54M12.71 15.16v7.93s2.54-.54 4.75-.5c3.68.04 5.54 2 5.68 4.54.04.64.04 1 .04 1.71v10.32h-3.89V28.62c0-1.29.07-2.89-2.86-2.89-2.11 0-3.57.39-3.57.39v13H9.04V15.37l3.68-.21ZM36.32 22.62s-3.46.07-5.5.5c-2.36.54-3.86 1.93-4.07 4.07-.04.43-.07.68-.07 1.61v10.36h3.89V28.59c0-.93.07-1.5.68-2.07.71-.61 2.29-.71 3.18-.79.61-.04 1.86-.07 1.86-.07l.04-3.04ZM53 33.76v-3.32h-2.86v-5.6H46.5v5.6h-4.57l6.82-15.85h-4l-6.89 15.85v3.32h8.64v5.4h3.82v-5.4H53z"/></g></svg>
|
|
@@ -1,20 +1,24 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
<
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<svg id="Ebene_2" data-name="Ebene 2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 62 62">
|
|
3
|
+
<defs>
|
|
4
|
+
<style>
|
|
5
|
+
.cls-1 {
|
|
6
|
+
fill: #fff;
|
|
7
|
+
}
|
|
8
|
+
.cls-2 {
|
|
9
|
+
fill: url(#Unbenannter_Verlauf);
|
|
10
|
+
}
|
|
11
|
+
</style>
|
|
12
|
+
<linearGradient id="Unbenannter_Verlauf" data-name="Unbenannter Verlauf" x1="51.64" y1="171.64" x2="12.95" y2="132.95" gradientTransform="translate(0 182) scale(1 -1)" gradientUnits="userSpaceOnUse">
|
|
13
|
+
<stop offset=".03" stop-color="#d6007f"/>
|
|
14
|
+
<stop offset=".48" stop-color="#9b0058"/>
|
|
15
|
+
</linearGradient>
|
|
16
|
+
</defs>
|
|
17
|
+
<path class="cls-2" d="m50,62H0V12C0,5.4,5.4,0,12,0h50v50c0,6.6-5.4,12-12,12Z"/>
|
|
18
|
+
<g>
|
|
19
|
+
<path class="cls-1" d="m30.36,47.41c-7.14.11-15.75-1.18-21.36-3.54v-2.14c5.86,2.46,13.86,3.75,20.96,3.64,7.68-.14,15.68-1.39,21.21-3.57v2.07c-6.14,2.18-13.18,3.39-20.82,3.54"/>
|
|
20
|
+
<path class="cls-1" d="m12.71,15.16v7.93s2.54-.54,4.75-.5c3.68.04,5.54,2,5.68,4.54.04.64.04,1,.04,1.71v10.32h-3.89v-10.54c0-1.29.07-2.89-2.86-2.89-2.11,0-3.57.39-3.57.39v13h-3.82V15.37l3.68-.21Z"/>
|
|
21
|
+
<path class="cls-1" d="m36.32,22.62s-3.46.07-5.5.5c-2.36.54-3.86,1.93-4.07,4.07-.04.43-.07.68-.07,1.61v10.36h3.89v-10.57c0-.93.07-1.5.68-2.07.71-.61,2.29-.71,3.18-.79.61-.04,1.86-.07,1.86-.07l.04-3.04h0Z"/>
|
|
22
|
+
<polygon class="cls-1" points="53 33.76 53 30.44 50.14 30.44 50.14 24.84 46.5 24.84 46.5 30.44 41.93 30.44 48.75 14.59 44.75 14.59 37.86 30.44 37.86 33.76 46.5 33.76 46.5 39.16 50.32 39.16 50.32 33.76 53 33.76"/>
|
|
23
|
+
</g>
|
|
20
24
|
</svg>
|
package/dist/assets/index.css
CHANGED
|
@@ -2817,7 +2817,7 @@ video {
|
|
|
2817
2817
|
transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
|
|
2818
2818
|
}
|
|
2819
2819
|
.counter-reset {
|
|
2820
|
-
counter-reset:
|
|
2820
|
+
counter-reset: cnt1689254531641;
|
|
2821
2821
|
}
|
|
2822
2822
|
.hyphens-auto {
|
|
2823
2823
|
-webkit-hyphens: auto;
|
|
@@ -3052,7 +3052,7 @@ video {
|
|
|
3052
3052
|
--tw-ring-color: rgba(255, 255, 255, 0.5);
|
|
3053
3053
|
}
|
|
3054
3054
|
.-ordered {
|
|
3055
|
-
counter-increment:
|
|
3055
|
+
counter-increment: cnt1689254531641 1;
|
|
3056
3056
|
}
|
|
3057
3057
|
.-ordered::before {
|
|
3058
3058
|
position: absolute;
|
|
@@ -3068,7 +3068,7 @@ video {
|
|
|
3068
3068
|
letter-spacing: .0125em;
|
|
3069
3069
|
--tw-text-opacity: 1;
|
|
3070
3070
|
color: rgba(0, 0, 0, var(--tw-text-opacity));
|
|
3071
|
-
content: counter(
|
|
3071
|
+
content: counter(cnt1689254531641);
|
|
3072
3072
|
}
|
|
3073
3073
|
/*! ****************************/
|
|
3074
3074
|
/*! text-shadow */
|
|
@@ -3165,6 +3165,7 @@ video {
|
|
|
3165
3165
|
--logo-padding-bottom-md: 10px;
|
|
3166
3166
|
--logo-padding-top-lg: 10px;
|
|
3167
3167
|
--logo-padding-bottom-lg: 10px;
|
|
3168
|
+
|
|
3168
3169
|
/*Hauptmenü*/
|
|
3169
3170
|
--color-top-topic-background: #d3e2f4;
|
|
3170
3171
|
/* Medieninhalte, Video, Audio, Bildergalerie */
|
|
@@ -3458,9 +3459,13 @@ video {
|
|
|
3458
3459
|
/* Brandnavigation Border and :before Colors*/
|
|
3459
3460
|
--color-brandnavigation-border-color: #606060;
|
|
3460
3461
|
--color-brandnav-pseudo: #606060;
|
|
3461
|
-
/* Logo
|
|
3462
|
-
--logo-padding-top:
|
|
3463
|
-
--logo-padding-bottom:
|
|
3462
|
+
/* Logo-Container Padding */
|
|
3463
|
+
--logo-padding-top: 8px;
|
|
3464
|
+
--logo-padding-bottom: 8px;
|
|
3465
|
+
--logo-padding-top-md: 8px;
|
|
3466
|
+
--logo-padding-bottom-md: 8px;
|
|
3467
|
+
--logo-padding-top-lg: 12px;
|
|
3468
|
+
--logo-padding-bottom-lg: 12px;
|
|
3464
3469
|
|
|
3465
3470
|
/* Medieninhalte, Video, Audio, Bildergalerie */
|
|
3466
3471
|
--color-label-media: #006eb7;
|
|
@@ -3587,9 +3592,13 @@ video {
|
|
|
3587
3592
|
/* Brandnavigation Border and :before Colors*/
|
|
3588
3593
|
--color-brandnavigation-border-color: #8d2725;
|
|
3589
3594
|
--color-brandnav-pseudo: #8d2725;
|
|
3590
|
-
/* Logo
|
|
3591
|
-
--logo-padding-top:
|
|
3592
|
-
--logo-padding-bottom:
|
|
3595
|
+
/* Logo-Container Padding */
|
|
3596
|
+
--logo-padding-top: 4px;
|
|
3597
|
+
--logo-padding-bottom: 6px;
|
|
3598
|
+
--logo-padding-top-md: 4px;
|
|
3599
|
+
--logo-padding-bottom-md: 4px;
|
|
3600
|
+
--logo-padding-top-lg: 6px;
|
|
3601
|
+
--logo-padding-bottom-lg: 6px;
|
|
3593
3602
|
|
|
3594
3603
|
/* Medieninhalte, Video, Audio, Bildergalerie */
|
|
3595
3604
|
--color-label-media: #8d2725;
|
|
@@ -3652,9 +3661,16 @@ video {
|
|
|
3652
3661
|
/* Brandnavigation Border and :before Colors*/
|
|
3653
3662
|
--color-brandnavigation-border-color: #00646f;
|
|
3654
3663
|
--color-brandnav-pseudo: #00646f;
|
|
3655
|
-
|
|
3656
|
-
|
|
3657
|
-
--logo-padding-
|
|
3664
|
+
|
|
3665
|
+
/* Logo-Container Padding */
|
|
3666
|
+
--logo-padding-top: 8px;
|
|
3667
|
+
--logo-padding-bottom: 8px;
|
|
3668
|
+
--logo-padding-top-md: 4px;
|
|
3669
|
+
--logo-padding-bottom-md: 4px;
|
|
3670
|
+
--logo-padding-top-lg: 4px;
|
|
3671
|
+
--logo-padding-bottom-lg: 4px;
|
|
3672
|
+
|
|
3673
|
+
|
|
3658
3674
|
/* Medieninhalte, Video, Audio, Bildergalerie */
|
|
3659
3675
|
--color-label-media: #00646f;
|
|
3660
3676
|
/* Ticker, Live, Livestream */
|
|
@@ -3995,9 +4011,14 @@ video {
|
|
|
3995
4011
|
/* Brandnavigation Border and :before Colors*/
|
|
3996
4012
|
--color-brandnavigation-border-color: #168378;
|
|
3997
4013
|
--color-brandnav-pseudo: #168378;
|
|
3998
|
-
/* Logo
|
|
3999
|
-
--logo-padding-top:4px;
|
|
4014
|
+
/* Logo-Container Padding */
|
|
4015
|
+
--logo-padding-top: 4px;
|
|
4000
4016
|
--logo-padding-bottom: 4px;
|
|
4017
|
+
--logo-padding-top-md: 6px;
|
|
4018
|
+
--logo-padding-bottom-md: 6px;
|
|
4019
|
+
--logo-padding-top-lg: 8px;
|
|
4020
|
+
--logo-padding-bottom-lg: 8px;
|
|
4021
|
+
|
|
4001
4022
|
/* Medieninhalte, Video, Audio, Bildergalerie */
|
|
4002
4023
|
--color-label-media: #168378;
|
|
4003
4024
|
/* Ticker, Live, Livestream */
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import TrackingCookie from 'components/externalService/trackingCookie.subfeature'
|
|
2
|
+
|
|
3
|
+
const isTrackingAllowed = () => {
|
|
4
|
+
const trackingCookie = new TrackingCookie()
|
|
5
|
+
return trackingCookie.isTrackingAccepted('ati')
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
const uxAction = (label, secondLevelId) => {
|
|
9
|
+
secondLevelId = secondLevelId || pageDisplayConfig.site_level2
|
|
10
|
+
if (pa && isTrackingAllowed()) {
|
|
11
|
+
pa.sendEvent('click.action', {
|
|
12
|
+
click: label,
|
|
13
|
+
site_level2: secondLevelId,
|
|
14
|
+
})
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
const uxNavigation = (label, secondLevelId) => {
|
|
19
|
+
secondLevelId = secondLevelId || pageDisplayConfig.site_level2
|
|
20
|
+
if (pa && isTrackingAllowed()) {
|
|
21
|
+
pa.sendEvent('click.navigation', {
|
|
22
|
+
click: label,
|
|
23
|
+
site_level2: secondLevelId,
|
|
24
|
+
})
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
const pi = (label, secondLevelId) => {
|
|
29
|
+
if (pa && isTrackingAllowed()) {
|
|
30
|
+
pa.sendEvent('page.display', pageDisplayConfig)
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
const download = (label, secondLevelId) => {
|
|
35
|
+
secondLevelId = secondLevelId || pageDisplayConfig.site_level2
|
|
36
|
+
if (pa && isTrackingAllowed()) {
|
|
37
|
+
pa.sendEvent('click.download', {
|
|
38
|
+
click: label,
|
|
39
|
+
site_level2: secondLevelId,
|
|
40
|
+
})
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
export { isTrackingAllowed, uxAction, uxNavigation, pi, download }
|
|
@@ -15,11 +15,109 @@ export default function playaudio() {
|
|
|
15
15
|
_player.duration = duration
|
|
16
16
|
_player.currentlyPlaying = false
|
|
17
17
|
_player.init = false
|
|
18
|
+
_player.firstPlay = true
|
|
19
|
+
|
|
20
|
+
_player.audioElement.addEventListener('play', handlePlay)
|
|
21
|
+
_player.audioElement.addEventListener('playing', handlePlaying)
|
|
22
|
+
_player.audioElement.addEventListener('pause', handlePause)
|
|
23
|
+
_player.audioElement.addEventListener('waiting', handleWaiting)
|
|
24
|
+
_player.audioElement.addEventListener('ended', handleStopped)
|
|
18
25
|
|
|
19
26
|
// this.playerCount == 0 ? _player.range.parentNode.classList.remove('hidden') : _player.range.parentNode.classList.add('hidden')
|
|
20
27
|
this.playerCount++
|
|
21
28
|
|
|
22
29
|
this.playlist[id] = _player
|
|
30
|
+
|
|
31
|
+
const settings = JSON.parse(this.playlist[id].audioElement.dataset.propMediaMetadata)
|
|
32
|
+
const avContent = {
|
|
33
|
+
av_content_id: settings.piano.av_content_id,
|
|
34
|
+
av_content: settings.piano.av_content,
|
|
35
|
+
av_content_type: settings.piano.av_content_type,
|
|
36
|
+
av_content_duration: settings.piano.av_content_duration,
|
|
37
|
+
av_broadcasting_type: settings.piano.av_broadcasting_type,
|
|
38
|
+
av_content_level1: settings.piano.av_content_level1,
|
|
39
|
+
hr_document_type: settings.piano.hr_document_type,
|
|
40
|
+
site_level2_id: settings.piano.site_level2_id,
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
if (settings.piano.av_content_level2) {
|
|
44
|
+
avContent.av_content_level2 = settings.piano.av_content_level2
|
|
45
|
+
}
|
|
46
|
+
if (settings.piano.av_content_level3) {
|
|
47
|
+
avContent.av_content_level3 = settings.piano.av_content_level3
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
function handlePlay(event) {
|
|
51
|
+
dispatchCustomEvent('hr-avInsights:play', {
|
|
52
|
+
playerId: getPlayerIdForAvInsights(),
|
|
53
|
+
cursorPosition: _player.audioElement.currentTime * 1000,
|
|
54
|
+
avContent: avContent,
|
|
55
|
+
})
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
function handlePlaying(event) {
|
|
59
|
+
if (_player.firstPlay) {
|
|
60
|
+
dispatchCustomEvent('hr-avInsights:playback-start', {
|
|
61
|
+
playerId: getPlayerIdForAvInsights(),
|
|
62
|
+
cursorPosition: _player.audioElement.currentTime * 1000,
|
|
63
|
+
avContent: avContent,
|
|
64
|
+
})
|
|
65
|
+
_player.firstPlay = false
|
|
66
|
+
} else {
|
|
67
|
+
dispatchCustomEvent('hr-avInsights:playback-resumed', {
|
|
68
|
+
playerId: getPlayerIdForAvInsights(),
|
|
69
|
+
cursorPosition: _player.audioElement.currentTime * 1000,
|
|
70
|
+
avContent: avContent,
|
|
71
|
+
})
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
function handleWaiting(event) {
|
|
76
|
+
dispatchCustomEvent('hr-avInsights:buffer-start', {
|
|
77
|
+
playerId: getPlayerIdForAvInsights(),
|
|
78
|
+
cursorPosition: _player.audioElement.currentTime * 1000,
|
|
79
|
+
avContent: avContent,
|
|
80
|
+
})
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
function handlePause(event) {
|
|
84
|
+
dispatchCustomEvent('hr-avInsights:playback-paused', {
|
|
85
|
+
playerId: getPlayerIdForAvInsights(),
|
|
86
|
+
cursorPosition: _player.audioElement.currentTime * 1000,
|
|
87
|
+
avContent: avContent,
|
|
88
|
+
})
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
function handleStopped(event) {
|
|
92
|
+
dispatchCustomEvent('hr-avInsights:playback-stopped', {
|
|
93
|
+
playerId: getPlayerIdForAvInsights(),
|
|
94
|
+
cursorPosition: _player.audioElement.currentTime * 1000,
|
|
95
|
+
avContent: avContent,
|
|
96
|
+
})
|
|
97
|
+
_player.firstPlay = true
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
function getPlayerIdForAvInsights() {
|
|
101
|
+
return _player.id + '-' + avContent.av_content_id
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
function dispatchCustomEvent(eventName, data = undefined, element = document) {
|
|
105
|
+
let event
|
|
106
|
+
|
|
107
|
+
if (undefined != data) {
|
|
108
|
+
data = { detail: data }
|
|
109
|
+
event = new CustomEvent(eventName, data)
|
|
110
|
+
} else {
|
|
111
|
+
if (typeof Event === 'function') {
|
|
112
|
+
event = new Event(eventName)
|
|
113
|
+
} else {
|
|
114
|
+
event = document.createEvent('Event')
|
|
115
|
+
event.initEvent(eventName, true, true)
|
|
116
|
+
}
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
element.dispatchEvent(event)
|
|
120
|
+
}
|
|
23
121
|
},
|
|
24
122
|
listenToGlobalStop() {
|
|
25
123
|
console.log('global listener init')
|
|
@@ -83,14 +83,15 @@
|
|
|
83
83
|
{{/unless}}
|
|
84
84
|
|
|
85
85
|
{{!-- AudioElement --}}
|
|
86
|
-
{{~#
|
|
86
|
+
{{~#if this.audioUrl ~}}
|
|
87
87
|
<audio
|
|
88
|
-
class="{{
|
|
89
|
-
data-id="{{
|
|
90
|
-
x-init="registerPlayer('{{
|
|
91
|
-
@stopotherplayers.window="stopAllOtherPlayers({{
|
|
92
|
-
|
|
88
|
+
class="{{_id}} hidden"
|
|
89
|
+
data-id="{{_id}}"
|
|
90
|
+
x-init="registerPlayer('{{_podcastDuration}}','{{_id}}')"
|
|
91
|
+
@stopotherplayers.window="stopAllOtherPlayers({{_id}})"
|
|
92
|
+
data-prop-media-metadata='{{json this.mediaMetadata}}'>
|
|
93
|
+
<source src={{this.audioUrl}} type='audio/mp3'/>
|
|
93
94
|
|
|
94
95
|
</audio>
|
|
95
|
-
{{/
|
|
96
|
+
{{/if}}
|
|
96
97
|
</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": "1.
|
|
9
|
+
"version": "1.31.0",
|
|
10
10
|
"scripts": {
|
|
11
11
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
12
12
|
"storybook": "storybook dev -p 6006 public",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg
|
|
1
|
+
<svg id="Ebene_2" data-name="Ebene 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 62 62" preserveAspectRatio="xMinYMid meet"><defs><linearGradient id="Unbenannter_Verlauf" data-name="Unbenannter Verlauf" x1="51.64" y1="171.64" x2="12.95" y2="132.95" gradientTransform="matrix(1 0 0 -1 0 182)" gradientUnits="userSpaceOnUse"><stop offset=".03" stop-color="#d6007f"/><stop offset=".48" stop-color="#9b0058"/></linearGradient><style>.cls-1{fill:#fff}</style></defs><path d="M50 62H0V12C0 5.4 5.4 0 12 0h50v50c0 6.6-5.4 12-12 12Z" style="fill:url(#Unbenannter_Verlauf)"/><g><path class="cls-1" d="M30.36 47.41c-7.14.11-15.75-1.18-21.36-3.54v-2.14c5.86 2.46 13.86 3.75 20.96 3.64 7.68-.14 15.68-1.39 21.21-3.57v2.07c-6.14 2.18-13.18 3.39-20.82 3.54M12.71 15.16v7.93s2.54-.54 4.75-.5c3.68.04 5.54 2 5.68 4.54.04.64.04 1 .04 1.71v10.32h-3.89V28.62c0-1.29.07-2.89-2.86-2.89-2.11 0-3.57.39-3.57.39v13H9.04V15.37l3.68-.21ZM36.32 22.62s-3.46.07-5.5.5c-2.36.54-3.86 1.93-4.07 4.07-.04.43-.07.68-.07 1.61v10.36h3.89V28.59c0-.93.07-1.5.68-2.07.71-.61 2.29-.71 3.18-.79.61-.04 1.86-.07 1.86-.07l.04-3.04ZM53 33.76v-3.32h-2.86v-5.6H46.5v5.6h-4.57l6.82-15.85h-4l-6.89 15.85v3.32h8.64v5.4h3.82v-5.4H53z"/></g></svg>
|
|
@@ -1,20 +1,24 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
<
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<svg id="Ebene_2" data-name="Ebene 2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 62 62">
|
|
3
|
+
<defs>
|
|
4
|
+
<style>
|
|
5
|
+
.cls-1 {
|
|
6
|
+
fill: #fff;
|
|
7
|
+
}
|
|
8
|
+
.cls-2 {
|
|
9
|
+
fill: url(#Unbenannter_Verlauf);
|
|
10
|
+
}
|
|
11
|
+
</style>
|
|
12
|
+
<linearGradient id="Unbenannter_Verlauf" data-name="Unbenannter Verlauf" x1="51.64" y1="171.64" x2="12.95" y2="132.95" gradientTransform="translate(0 182) scale(1 -1)" gradientUnits="userSpaceOnUse">
|
|
13
|
+
<stop offset=".03" stop-color="#d6007f"/>
|
|
14
|
+
<stop offset=".48" stop-color="#9b0058"/>
|
|
15
|
+
</linearGradient>
|
|
16
|
+
</defs>
|
|
17
|
+
<path class="cls-2" d="m50,62H0V12C0,5.4,5.4,0,12,0h50v50c0,6.6-5.4,12-12,12Z"/>
|
|
18
|
+
<g>
|
|
19
|
+
<path class="cls-1" d="m30.36,47.41c-7.14.11-15.75-1.18-21.36-3.54v-2.14c5.86,2.46,13.86,3.75,20.96,3.64,7.68-.14,15.68-1.39,21.21-3.57v2.07c-6.14,2.18-13.18,3.39-20.82,3.54"/>
|
|
20
|
+
<path class="cls-1" d="m12.71,15.16v7.93s2.54-.54,4.75-.5c3.68.04,5.54,2,5.68,4.54.04.64.04,1,.04,1.71v10.32h-3.89v-10.54c0-1.29.07-2.89-2.86-2.89-2.11,0-3.57.39-3.57.39v13h-3.82V15.37l3.68-.21Z"/>
|
|
21
|
+
<path class="cls-1" d="m36.32,22.62s-3.46.07-5.5.5c-2.36.54-3.86,1.93-4.07,4.07-.04.43-.07.68-.07,1.61v10.36h3.89v-10.57c0-.93.07-1.5.68-2.07.71-.61,2.29-.71,3.18-.79.61-.04,1.86-.07,1.86-.07l.04-3.04h0Z"/>
|
|
22
|
+
<polygon class="cls-1" points="53 33.76 53 30.44 50.14 30.44 50.14 24.84 46.5 24.84 46.5 30.44 41.93 30.44 48.75 14.59 44.75 14.59 37.86 30.44 37.86 33.76 46.5 33.76 46.5 39.16 50.32 39.16 50.32 33.76 53 33.76"/>
|
|
23
|
+
</g>
|
|
20
24
|
</svg>
|
|
@@ -1460,6 +1460,52 @@
|
|
|
1460
1460
|
}
|
|
1461
1461
|
]
|
|
1462
1462
|
},
|
|
1463
|
+
"mediaMetadata": {
|
|
1464
|
+
"agf": {
|
|
1465
|
+
"title": "hr-fernsehen_Hessischer Rundfunk_Ein aufgewecktes Kerlchen_06.10.2022 04:40",
|
|
1466
|
+
"livestream": "no",
|
|
1467
|
+
"type": "content",
|
|
1468
|
+
"airdate": "06.10.2022 04:40",
|
|
1469
|
+
"program": "hr-fernsehen",
|
|
1470
|
+
"nol_c18": "p18,N",
|
|
1471
|
+
"uurl": "/mp3/podcast/hr4_polizeireport/hr4_polizeireport_20221006_95936793.mp3",
|
|
1472
|
+
"nol_c7": "p7,/mp3/podcast/hr4_polizeireport/hr4_polizeireport_20221006_95936793.mp3",
|
|
1473
|
+
"nol_c8": "p8,131",
|
|
1474
|
+
"nol_c9": "p9,Hessischer Rundfunk_Ein aufgewecktes Kerlchen_06.10.2022 04:40",
|
|
1475
|
+
"nol_c10": "p10,hr-fernsehen",
|
|
1476
|
+
"nol_c12": "p12,Content",
|
|
1477
|
+
"assetid": "hr4_polizeireport_95936793",
|
|
1478
|
+
"nol_c2": "p2,N",
|
|
1479
|
+
"nol_c5": "p5,hr4",
|
|
1480
|
+
"length": "131",
|
|
1481
|
+
"nol_c20": "p20,GFKLinkID"
|
|
1482
|
+
},
|
|
1483
|
+
"ati": {
|
|
1484
|
+
"pageName": "Ein aufgewecktes Kerlchen",
|
|
1485
|
+
"secondLevelId": "2",
|
|
1486
|
+
"documentName": "podcast-episode-108850",
|
|
1487
|
+
"documentType": "hr-nt:podcastEpisode",
|
|
1488
|
+
"documentDate": "2022-10-06T06:46:25+02:00",
|
|
1489
|
+
"chapter": "podcast::polizeireport",
|
|
1490
|
+
"mediaLabel": "Ein aufgewecktes Kerlchen",
|
|
1491
|
+
"mediaTheme1": "hr4",
|
|
1492
|
+
"mediaTheme2": "podcast::polizeireport",
|
|
1493
|
+
"atiSiteId": "578129",
|
|
1494
|
+
"atiTrackingHost": "https://logs1407"
|
|
1495
|
+
},
|
|
1496
|
+
"piano": {
|
|
1497
|
+
"av_content_id": "podcast-episode-108850",
|
|
1498
|
+
"av_content": "Ein aufgewecktes Kerlchen",
|
|
1499
|
+
"av_content_type": "Audio",
|
|
1500
|
+
"av_content_duration": 131000,
|
|
1501
|
+
"av_broadcasting_type": "OnDemand",
|
|
1502
|
+
"av_content_level1": "hr4",
|
|
1503
|
+
"av_content_level2": "podcast",
|
|
1504
|
+
"av_content_level3": "polizeireport",
|
|
1505
|
+
"hr_document_type": "hr-nt:podcastEpisode",
|
|
1506
|
+
"site_level2_id": "2"
|
|
1507
|
+
}
|
|
1508
|
+
},
|
|
1463
1509
|
|
|
1464
1510
|
"documentSection": "Kultur",
|
|
1465
1511
|
"displayTeaserBodyAsImageOverlay": false,
|
package/src/assets/tailwind.css
CHANGED
|
@@ -35,6 +35,7 @@
|
|
|
35
35
|
--logo-padding-bottom-md: 10px;
|
|
36
36
|
--logo-padding-top-lg: 10px;
|
|
37
37
|
--logo-padding-bottom-lg: 10px;
|
|
38
|
+
|
|
38
39
|
/*Hauptmenü*/
|
|
39
40
|
--color-top-topic-background: theme('colors.blue.linkWater');
|
|
40
41
|
/* Medieninhalte, Video, Audio, Bildergalerie */
|
|
@@ -332,9 +333,13 @@
|
|
|
332
333
|
/* Brandnavigation Border and :before Colors*/
|
|
333
334
|
--color-brandnavigation-border-color: theme('colors.gray.scorpion');
|
|
334
335
|
--color-brandnav-pseudo: theme('colors.gray.scorpion');
|
|
335
|
-
/* Logo
|
|
336
|
-
--logo-padding-top:
|
|
337
|
-
--logo-padding-bottom:
|
|
336
|
+
/* Logo-Container Padding */
|
|
337
|
+
--logo-padding-top: 8px;
|
|
338
|
+
--logo-padding-bottom: 8px;
|
|
339
|
+
--logo-padding-top-md: 8px;
|
|
340
|
+
--logo-padding-bottom-md: 8px;
|
|
341
|
+
--logo-padding-top-lg: 12px;
|
|
342
|
+
--logo-padding-bottom-lg: 12px;
|
|
338
343
|
|
|
339
344
|
/* Medieninhalte, Video, Audio, Bildergalerie */
|
|
340
345
|
--color-label-media: theme('colors.blue.deepCerulean');
|
|
@@ -463,9 +468,13 @@
|
|
|
463
468
|
/* Brandnavigation Border and :before Colors*/
|
|
464
469
|
--color-brandnavigation-border-color: theme('colors.red.burntUmber');
|
|
465
470
|
--color-brandnav-pseudo: theme('colors.red.burntUmber');
|
|
466
|
-
/* Logo
|
|
467
|
-
--logo-padding-top:
|
|
468
|
-
--logo-padding-bottom:
|
|
471
|
+
/* Logo-Container Padding */
|
|
472
|
+
--logo-padding-top: 4px;
|
|
473
|
+
--logo-padding-bottom: 6px;
|
|
474
|
+
--logo-padding-top-md: 4px;
|
|
475
|
+
--logo-padding-bottom-md: 4px;
|
|
476
|
+
--logo-padding-top-lg: 6px;
|
|
477
|
+
--logo-padding-bottom-lg: 6px;
|
|
469
478
|
|
|
470
479
|
/* Medieninhalte, Video, Audio, Bildergalerie */
|
|
471
480
|
--color-label-media: theme('colors.red.burntUmber');
|
|
@@ -529,9 +538,16 @@
|
|
|
529
538
|
/* Brandnavigation Border and :before Colors*/
|
|
530
539
|
--color-brandnavigation-border-color: theme('colors.blue.blueStone');
|
|
531
540
|
--color-brandnav-pseudo: theme('colors.blue.blueStone');
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
--logo-padding-
|
|
541
|
+
|
|
542
|
+
/* Logo-Container Padding */
|
|
543
|
+
--logo-padding-top: 8px;
|
|
544
|
+
--logo-padding-bottom: 8px;
|
|
545
|
+
--logo-padding-top-md: 4px;
|
|
546
|
+
--logo-padding-bottom-md: 4px;
|
|
547
|
+
--logo-padding-top-lg: 4px;
|
|
548
|
+
--logo-padding-bottom-lg: 4px;
|
|
549
|
+
|
|
550
|
+
|
|
535
551
|
/* Medieninhalte, Video, Audio, Bildergalerie */
|
|
536
552
|
--color-label-media: theme('colors.blue.blueStone');
|
|
537
553
|
/* Ticker, Live, Livestream */
|
|
@@ -877,9 +893,14 @@
|
|
|
877
893
|
/* Brandnavigation Border and :before Colors*/
|
|
878
894
|
--color-brandnavigation-border-color: theme('colors.green.genoa');
|
|
879
895
|
--color-brandnav-pseudo: theme('colors.green.genoa');
|
|
880
|
-
/* Logo
|
|
881
|
-
--logo-padding-top:4px;
|
|
896
|
+
/* Logo-Container Padding */
|
|
897
|
+
--logo-padding-top: 4px;
|
|
882
898
|
--logo-padding-bottom: 4px;
|
|
899
|
+
--logo-padding-top-md: 6px;
|
|
900
|
+
--logo-padding-bottom-md: 6px;
|
|
901
|
+
--logo-padding-top-lg: 8px;
|
|
902
|
+
--logo-padding-bottom-lg: 8px;
|
|
903
|
+
|
|
883
904
|
/* Medieninhalte, Video, Audio, Bildergalerie */
|
|
884
905
|
--color-label-media: theme('colors.green.genoa');
|
|
885
906
|
/* Ticker, Live, Livestream */
|