hr-design-system-handlebars 0.121.2 → 0.121.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.
- package/CHANGELOG.md +12 -0
- package/dist/assets/index.css +14 -11
- package/dist/views/components/content_nav/content_nav_container.hbs +1 -1
- package/dist/views/components/teaser/podcast/podcast_playlist_player.hbs +15 -13
- package/dist/views/components/teaser/podcast/podcast_playlist_shorttext.hbs +10 -0
- package/dist/views/components/teaser/podcast/podcast_subscribe_button.hbs +3 -3
- package/dist/views/components/teaser/podcast/podcast_title.hbs +1 -1
- package/package.json +1 -1
- package/src/assets/css/custom-components.css +1 -1
- package/src/stories/views/components/content_nav/content_nav_container.hbs +1 -1
- package/src/stories/views/components/teaser/podcast/podcast_playlist_player.hbs +15 -13
- package/src/stories/views/components/teaser/podcast/podcast_playlist_shorttext.hbs +10 -0
- package/src/stories/views/components/teaser/podcast/podcast_subscribe_button.hbs +3 -3
- package/src/stories/views/components/teaser/podcast/podcast_title.hbs +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,15 @@
|
|
|
1
|
+
# v0.121.3 (Fri Jan 20 2023)
|
|
2
|
+
|
|
3
|
+
#### 🐛 Bug Fix
|
|
4
|
+
|
|
5
|
+
- Dpe 2007 2 [#495](https://github.com/mumprod/hr-design-system-handlebars/pull/495) ([@StefanVesper](https://github.com/StefanVesper))
|
|
6
|
+
|
|
7
|
+
#### Authors: 1
|
|
8
|
+
|
|
9
|
+
- SonicSoulSurfer ([@StefanVesper](https://github.com/StefanVesper))
|
|
10
|
+
|
|
11
|
+
---
|
|
12
|
+
|
|
1
13
|
# v0.121.2 (Fri Jan 20 2023)
|
|
2
14
|
|
|
3
15
|
#### 🐛 Bug Fix
|
package/dist/assets/index.css
CHANGED
|
@@ -672,7 +672,7 @@ video {
|
|
|
672
672
|
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0);
|
|
673
673
|
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
|
|
674
674
|
--tw-ring-inset: inset;
|
|
675
|
-
--tw-ring-color:
|
|
675
|
+
--tw-ring-color: var(--color-focus-state);
|
|
676
676
|
}
|
|
677
677
|
.ds-link-inset:focus:not(:focus-visible) {
|
|
678
678
|
--tw-shadow: 0 0 rgba(0,0,0,0);
|
|
@@ -1037,6 +1037,9 @@ video {
|
|
|
1037
1037
|
.-z-1000 {
|
|
1038
1038
|
z-index: -1000;
|
|
1039
1039
|
}
|
|
1040
|
+
.z-9999 {
|
|
1041
|
+
z-index: 9999;
|
|
1042
|
+
}
|
|
1040
1043
|
.order-1 {
|
|
1041
1044
|
order: 1;
|
|
1042
1045
|
}
|
|
@@ -2483,7 +2486,7 @@ video {
|
|
|
2483
2486
|
transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
|
|
2484
2487
|
}
|
|
2485
2488
|
.counter-reset {
|
|
2486
|
-
counter-reset:
|
|
2489
|
+
counter-reset: cnt1674233895565;
|
|
2487
2490
|
}
|
|
2488
2491
|
.line-clamp-4 {
|
|
2489
2492
|
overflow: hidden;
|
|
@@ -2701,7 +2704,7 @@ video {
|
|
|
2701
2704
|
--tw-ring-color: rgba(255, 255, 255, 0.5);
|
|
2702
2705
|
}
|
|
2703
2706
|
.-ordered {
|
|
2704
|
-
counter-increment:
|
|
2707
|
+
counter-increment: cnt1674233895565 1;
|
|
2705
2708
|
}
|
|
2706
2709
|
.-ordered::before {
|
|
2707
2710
|
position: absolute;
|
|
@@ -2717,7 +2720,7 @@ video {
|
|
|
2717
2720
|
letter-spacing: .0125em;
|
|
2718
2721
|
--tw-text-opacity: 1;
|
|
2719
2722
|
color: rgba(0, 0, 0, var(--tw-text-opacity));
|
|
2720
|
-
content: counter(
|
|
2723
|
+
content: counter(cnt1674233895565);
|
|
2721
2724
|
}
|
|
2722
2725
|
/*! ****************************/
|
|
2723
2726
|
/*! text-shadow */
|
|
@@ -4182,13 +4185,6 @@ video {
|
|
|
4182
4185
|
-webkit-box-orient: vertical;
|
|
4183
4186
|
-webkit-line-clamp: 4;
|
|
4184
4187
|
}
|
|
4185
|
-
|
|
4186
|
-
.md\:line-clamp-2 {
|
|
4187
|
-
overflow: hidden;
|
|
4188
|
-
display: -webkit-box;
|
|
4189
|
-
-webkit-box-orient: vertical;
|
|
4190
|
-
-webkit-line-clamp: 2;
|
|
4191
|
-
}
|
|
4192
4188
|
.md\:ar-16-9 {
|
|
4193
4189
|
aspect-ratio: 16 / 9;
|
|
4194
4190
|
}
|
|
@@ -4664,6 +4660,13 @@ video {
|
|
|
4664
4660
|
-webkit-line-clamp: 5;
|
|
4665
4661
|
}
|
|
4666
4662
|
|
|
4663
|
+
.lg\:line-clamp-2 {
|
|
4664
|
+
overflow: hidden;
|
|
4665
|
+
display: -webkit-box;
|
|
4666
|
+
-webkit-box-orient: vertical;
|
|
4667
|
+
-webkit-line-clamp: 2;
|
|
4668
|
+
}
|
|
4669
|
+
|
|
4667
4670
|
.lg\:col-main {
|
|
4668
4671
|
grid-column: main;
|
|
4669
4672
|
}
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
{{#if this.isAutosuggest}}
|
|
7
7
|
<div class="flex mx-0 w-full h-10 border-blue-congress align-center{{#if _autoSuggestContainerCss}} {{_autoSuggestContainerCss}}{{/if}}">
|
|
8
8
|
<input x-ref="autosuggestInput"
|
|
9
|
-
class="w-full h-10 pl-2 bg-gray-200 border-b-8 border-white text-grey-dark placeholder:text-grey-dark focus:outline-none js-autosuggest-input"
|
|
9
|
+
class="w-full h-10 pl-2 bg-gray-200 border-b-8 border-white ds-link-inset text-grey-dark placeholder:text-grey-dark focus:outline-none js-autosuggest-input"
|
|
10
10
|
type="text"
|
|
11
11
|
placeholder="Eintrag filtern"/>
|
|
12
12
|
</div>
|
|
@@ -18,21 +18,15 @@
|
|
|
18
18
|
{{> components/teaser/podcast/podcast_title _title=this.title _teaserSize=this.teaserSize _addClass="" }}
|
|
19
19
|
</div>
|
|
20
20
|
|
|
21
|
-
{{
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
<span class="c-teaser__shorttext"> {{this}} </span>
|
|
27
|
-
</div>
|
|
28
|
-
{{/with~}}
|
|
29
|
-
{{/unless}}
|
|
30
|
-
{{/unless}}
|
|
31
|
-
|
|
21
|
+
{{#switch this.teaserSize }}
|
|
22
|
+
{{#case 100}}
|
|
23
|
+
{{> components/teaser/podcast/podcast_playlist_shorttext}}
|
|
24
|
+
{{/case}}
|
|
25
|
+
{{/switch}}
|
|
32
26
|
</div>
|
|
33
27
|
|
|
34
28
|
{{!-- Podcast Image --}}
|
|
35
|
-
<div class="flex flex-col ">
|
|
29
|
+
<div class="flex flex-col pb-5">
|
|
36
30
|
<div class="w-24 md:w-32 lg:w-42">
|
|
37
31
|
{{> components/base/image/responsive_image this.teaseritem
|
|
38
32
|
_type="podcastEpisodePlayer"
|
|
@@ -43,8 +37,16 @@
|
|
|
43
37
|
}}
|
|
44
38
|
</div>
|
|
45
39
|
</div>
|
|
46
|
-
|
|
47
40
|
</div>
|
|
41
|
+
|
|
42
|
+
{{#switch this.teaserSize }}
|
|
43
|
+
{{#case 50}}
|
|
44
|
+
<div class="flex flex-row w-full px-5 md:pl-5">
|
|
45
|
+
{{> components/teaser/podcast/podcast_playlist_shorttext}}
|
|
46
|
+
</div>
|
|
47
|
+
{{/case}}
|
|
48
|
+
{{/switch}}
|
|
49
|
+
|
|
48
50
|
{{!-- Abo-Dropdown --}}
|
|
49
51
|
<div class="flex flex-row px-5 md:pr-0">
|
|
50
52
|
{{> components/teaser/podcast/podcast_subscribe_button}}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
{{!-- Shorttext --}}
|
|
2
|
+
{{#unless _isSinglePage}}
|
|
3
|
+
{{#unless this.hideShortText}}
|
|
4
|
+
{{~#with this.shorttext}}
|
|
5
|
+
<div class="hidden pb-6 text-sm md:flex md:text-base font-copy">
|
|
6
|
+
<span class="c-teaser__shorttext"> {{this}} </span>
|
|
7
|
+
</div>
|
|
8
|
+
{{/with~}}
|
|
9
|
+
{{/unless}}
|
|
10
|
+
{{/unless}}
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
x-on:keydown.escape.prevent.stop="close($refs.button)"
|
|
17
17
|
x-on:focusin.window="! $refs.panel.contains($event.target) && close()"
|
|
18
18
|
x-id="['dropdown-button']"
|
|
19
|
-
class="relative
|
|
19
|
+
class="relative h-10 z-9999"
|
|
20
20
|
>
|
|
21
21
|
|
|
22
22
|
{{!-- Button --}}
|
|
@@ -44,13 +44,13 @@
|
|
|
44
44
|
x-on:click.outside="close($refs.button)"
|
|
45
45
|
:id="$id('dropdown-button')"
|
|
46
46
|
style="display: none;"
|
|
47
|
-
class="left-0 w-full
|
|
47
|
+
class="left-0 w-full text-sm text-white font-heading grow bg-podcast-highlight"
|
|
48
48
|
>
|
|
49
49
|
{{~#with this.podcastHoster~}}
|
|
50
50
|
<ul>
|
|
51
51
|
{{~#each this~}}
|
|
52
52
|
<li class="{{#unless @last}}border-b{{/unless}}">
|
|
53
|
-
<a class="flex py-2 text-left ds-link whitespace-nowrap hover:underline disabled:text-gray-500"
|
|
53
|
+
<a class="flex px-2 py-2 text-left ds-link whitespace-nowrap hover:underline disabled:text-gray-500"
|
|
54
54
|
title="{{this.podcastHosterName}}"
|
|
55
55
|
target="_blank"
|
|
56
56
|
rel="noopener noreferrer"
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
{{#decorator 'components/base/link' _css="group ds-link font-title text-base mt-2.5 text-podcast-text line-clamp-4
|
|
1
|
+
{{#decorator 'components/base/link' _css="group ds-link font-title text-base mt-2.5 text-podcast-text line-clamp-4 lg:line-clamp-2 ..." }}
|
|
2
2
|
<span class="block mt-0.5 group-hover:underline {{#if _ordered}} pl-8 {{/if}} {{~ inline-switch _teaserSize '["hero","100","50"]''["text-base md:text-2xl","text-base md:text-2xl","text-base md:text-lg"]' ~}}">
|
|
3
3
|
{{~_title~}}
|
|
4
4
|
</span>
|
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.121.
|
|
9
|
+
"version": "0.121.3",
|
|
10
10
|
"scripts": {
|
|
11
11
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
12
12
|
"storybook": "start-storybook -p 6006 public",
|
|
@@ -106,7 +106,7 @@
|
|
|
106
106
|
}
|
|
107
107
|
|
|
108
108
|
.ds-link-inset {
|
|
109
|
-
@apply block focus:ring-inset focus:ring-4 focus:outline-none focus:ring-
|
|
109
|
+
@apply block focus:ring-inset focus:ring-4 focus:outline-none focus:ring-focus-state ;
|
|
110
110
|
}
|
|
111
111
|
|
|
112
112
|
.ds-link-inset:focus:not(:focus-visible) {
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
{{#if this.isAutosuggest}}
|
|
7
7
|
<div class="flex mx-0 w-full h-10 border-blue-congress align-center{{#if _autoSuggestContainerCss}} {{_autoSuggestContainerCss}}{{/if}}">
|
|
8
8
|
<input x-ref="autosuggestInput"
|
|
9
|
-
class="w-full h-10 pl-2 bg-gray-200 border-b-8 border-white text-grey-dark placeholder:text-grey-dark focus:outline-none js-autosuggest-input"
|
|
9
|
+
class="w-full h-10 pl-2 bg-gray-200 border-b-8 border-white ds-link-inset text-grey-dark placeholder:text-grey-dark focus:outline-none js-autosuggest-input"
|
|
10
10
|
type="text"
|
|
11
11
|
placeholder="Eintrag filtern"/>
|
|
12
12
|
</div>
|
|
@@ -18,21 +18,15 @@
|
|
|
18
18
|
{{> components/teaser/podcast/podcast_title _title=this.title _teaserSize=this.teaserSize _addClass="" }}
|
|
19
19
|
</div>
|
|
20
20
|
|
|
21
|
-
{{
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
<span class="c-teaser__shorttext"> {{this}} </span>
|
|
27
|
-
</div>
|
|
28
|
-
{{/with~}}
|
|
29
|
-
{{/unless}}
|
|
30
|
-
{{/unless}}
|
|
31
|
-
|
|
21
|
+
{{#switch this.teaserSize }}
|
|
22
|
+
{{#case 100}}
|
|
23
|
+
{{> components/teaser/podcast/podcast_playlist_shorttext}}
|
|
24
|
+
{{/case}}
|
|
25
|
+
{{/switch}}
|
|
32
26
|
</div>
|
|
33
27
|
|
|
34
28
|
{{!-- Podcast Image --}}
|
|
35
|
-
<div class="flex flex-col ">
|
|
29
|
+
<div class="flex flex-col pb-5">
|
|
36
30
|
<div class="w-24 md:w-32 lg:w-42">
|
|
37
31
|
{{> components/base/image/responsive_image this.teaseritem
|
|
38
32
|
_type="podcastEpisodePlayer"
|
|
@@ -43,8 +37,16 @@
|
|
|
43
37
|
}}
|
|
44
38
|
</div>
|
|
45
39
|
</div>
|
|
46
|
-
|
|
47
40
|
</div>
|
|
41
|
+
|
|
42
|
+
{{#switch this.teaserSize }}
|
|
43
|
+
{{#case 50}}
|
|
44
|
+
<div class="flex flex-row w-full px-5 md:pl-5">
|
|
45
|
+
{{> components/teaser/podcast/podcast_playlist_shorttext}}
|
|
46
|
+
</div>
|
|
47
|
+
{{/case}}
|
|
48
|
+
{{/switch}}
|
|
49
|
+
|
|
48
50
|
{{!-- Abo-Dropdown --}}
|
|
49
51
|
<div class="flex flex-row px-5 md:pr-0">
|
|
50
52
|
{{> components/teaser/podcast/podcast_subscribe_button}}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
{{!-- Shorttext --}}
|
|
2
|
+
{{#unless _isSinglePage}}
|
|
3
|
+
{{#unless this.hideShortText}}
|
|
4
|
+
{{~#with this.shorttext}}
|
|
5
|
+
<div class="hidden pb-6 text-sm md:flex md:text-base font-copy">
|
|
6
|
+
<span class="c-teaser__shorttext"> {{this}} </span>
|
|
7
|
+
</div>
|
|
8
|
+
{{/with~}}
|
|
9
|
+
{{/unless}}
|
|
10
|
+
{{/unless}}
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
x-on:keydown.escape.prevent.stop="close($refs.button)"
|
|
17
17
|
x-on:focusin.window="! $refs.panel.contains($event.target) && close()"
|
|
18
18
|
x-id="['dropdown-button']"
|
|
19
|
-
class="relative
|
|
19
|
+
class="relative h-10 z-9999"
|
|
20
20
|
>
|
|
21
21
|
|
|
22
22
|
{{!-- Button --}}
|
|
@@ -44,13 +44,13 @@
|
|
|
44
44
|
x-on:click.outside="close($refs.button)"
|
|
45
45
|
:id="$id('dropdown-button')"
|
|
46
46
|
style="display: none;"
|
|
47
|
-
class="left-0 w-full
|
|
47
|
+
class="left-0 w-full text-sm text-white font-heading grow bg-podcast-highlight"
|
|
48
48
|
>
|
|
49
49
|
{{~#with this.podcastHoster~}}
|
|
50
50
|
<ul>
|
|
51
51
|
{{~#each this~}}
|
|
52
52
|
<li class="{{#unless @last}}border-b{{/unless}}">
|
|
53
|
-
<a class="flex py-2 text-left ds-link whitespace-nowrap hover:underline disabled:text-gray-500"
|
|
53
|
+
<a class="flex px-2 py-2 text-left ds-link whitespace-nowrap hover:underline disabled:text-gray-500"
|
|
54
54
|
title="{{this.podcastHosterName}}"
|
|
55
55
|
target="_blank"
|
|
56
56
|
rel="noopener noreferrer"
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
{{#decorator 'components/base/link' _css="group ds-link font-title text-base mt-2.5 text-podcast-text line-clamp-4
|
|
1
|
+
{{#decorator 'components/base/link' _css="group ds-link font-title text-base mt-2.5 text-podcast-text line-clamp-4 lg:line-clamp-2 ..." }}
|
|
2
2
|
<span class="block mt-0.5 group-hover:underline {{#if _ordered}} pl-8 {{/if}} {{~ inline-switch _teaserSize '["hero","100","50"]''["text-base md:text-2xl","text-base md:text-2xl","text-base md:text-lg"]' ~}}">
|
|
3
3
|
{{~_title~}}
|
|
4
4
|
</span>
|