hr-design-system-handlebars 1.114.143 → 1.114.144
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 +13 -0
- package/dist/assets/index.css +3 -3
- package/dist/views/components/button/utilities/button_on_image_classes.hbs +3 -0
- package/dist/views/components/teaser/vertical_video/vertical_video_teaser.hbs +18 -0
- package/dist/views/components/teaser/vertical_video/vertical_video_teaser_group.hbs +28 -0
- package/dist/views_static/components/button/utilities/button_on_image_classes.hbs +3 -0
- package/dist/views_static/components/teaser/vertical_video/vertical_video_teaser.hbs +18 -0
- package/dist/views_static/components/teaser/vertical_video/vertical_video_teaser_group.hbs +28 -0
- package/package.json +1 -1
- package/src/stories/views/components/button/utilities/button_on_image_classes.hbs +3 -0
- package/src/stories/views/components/teaser/vertical_video/vertical_video_teaser.hbs +18 -0
- package/src/stories/views/components/teaser/vertical_video/vertical_video_teaser_group.hbs +28 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,16 @@
|
|
|
1
|
+
# v1.114.144 (Mon Jun 16 2025)
|
|
2
|
+
|
|
3
|
+
#### 🐛 Bug Fix
|
|
4
|
+
|
|
5
|
+
- Dpe 3649 v2 [#1285](https://github.com/mumprod/hr-design-system-handlebars/pull/1285) ([@vascoeduardo](https://github.com/vascoeduardo) [@eduardo-hr](https://github.com/eduardo-hr))
|
|
6
|
+
|
|
7
|
+
#### Authors: 2
|
|
8
|
+
|
|
9
|
+
- [@eduardo-hr](https://github.com/eduardo-hr)
|
|
10
|
+
- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
|
|
11
|
+
|
|
12
|
+
---
|
|
13
|
+
|
|
1
14
|
# v1.114.143 (Tue Jun 03 2025)
|
|
2
15
|
|
|
3
16
|
#### 🐛 Bug Fix
|
package/dist/assets/index.css
CHANGED
|
@@ -3888,7 +3888,7 @@ article #commentList {
|
|
|
3888
3888
|
border-bottom-color: var(--color-secondary-ds);
|
|
3889
3889
|
}
|
|
3890
3890
|
.counter-reset {
|
|
3891
|
-
counter-reset:
|
|
3891
|
+
counter-reset: cnt1750087209783;
|
|
3892
3892
|
}
|
|
3893
3893
|
.animate-delay-100 {
|
|
3894
3894
|
--tw-animate-delay: 100ms;
|
|
@@ -4349,7 +4349,7 @@ html { scroll-behavior: smooth; }
|
|
|
4349
4349
|
--tw-ring-color: rgba(255, 255, 255, 0.5);
|
|
4350
4350
|
}
|
|
4351
4351
|
.-ordered {
|
|
4352
|
-
counter-increment:
|
|
4352
|
+
counter-increment: cnt1750087209783 1;
|
|
4353
4353
|
}
|
|
4354
4354
|
.-ordered::before {
|
|
4355
4355
|
position: absolute;
|
|
@@ -4367,7 +4367,7 @@ html { scroll-behavior: smooth; }
|
|
|
4367
4367
|
--tw-text-opacity: 1;
|
|
4368
4368
|
color: rgba(0, 0, 0, 1);
|
|
4369
4369
|
color: rgba(0, 0, 0, var(--tw-text-opacity));
|
|
4370
|
-
content: counter(
|
|
4370
|
+
content: counter(cnt1750087209783);
|
|
4371
4371
|
}
|
|
4372
4372
|
/*! ****************************/
|
|
4373
4373
|
/*! DataPolicy stuff */
|
|
@@ -43,4 +43,7 @@ absolute
|
|
|
43
43
|
{{~#case 'ticker-alternative'~}}
|
|
44
44
|
{{~inline-switch _teaserSize '["hero","100","50"]' '[" m-4"," m-2 md:m-3"," m-2"]'~}}
|
|
45
45
|
{{~/case~}}
|
|
46
|
+
{{~#case 'video-vertical'~}}
|
|
47
|
+
{{~inline-switch _teaserSize '["25"]' '[" m-2 md:m-3"," m-2 md:m-3"]'~}}
|
|
48
|
+
{{~/case~}}
|
|
46
49
|
{{~/switch~}}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
<article class="shrink-0 w-[90vw] sm:w-[calc(25%-12px)] rounded-lg [scroll-snap-align:start]" x-data="{ avStart: false }">
|
|
2
|
+
<section class="bg-white">
|
|
3
|
+
<div class="relative">
|
|
4
|
+
<figure class="{{> components/teaser/utilities/teaser_image_cypress_hook_classes}} relative ar-9-16 w-full" >
|
|
5
|
+
{{#with this.toModel.videoElement}}
|
|
6
|
+
{{~> components/mediaplayer/media_player _playerLocation="Teaser" _uiTestHook="ui-test-video-ondemand-player" _isUsedInTeaser=true _addClassImg=../../_addClassImg~}}
|
|
7
|
+
{{~> components/teaser/components/teaser_media_player ../../this _isVertical=true _playerId=this.ardPlayerConfig.playerId _mediaButtonIcon="play_button" _mediaButtonLabel="Video" _aspectRatio="ar-9-16" _addClassImg="" }}
|
|
8
|
+
{{/with}}
|
|
9
|
+
</figure>
|
|
10
|
+
<div class="absolute left-0 w-full pr-2 bottom-16">
|
|
11
|
+
<span class="w-full px-2 py-1 text-lg text-white hyphens-limit-15 bg-primary box-decoration-clone font-title ">
|
|
12
|
+
{{this.title }}
|
|
13
|
+
</span>
|
|
14
|
+
</div>
|
|
15
|
+
</div>
|
|
16
|
+
<p class="mt-2 ml-2 text-xs sm:ml-0 text-gray-scorpion font-headingSerif empty:hidden overflow-anywhere hyphens-auto">{{_meta}}</p>
|
|
17
|
+
</section>
|
|
18
|
+
</article>
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
{{#if this.hasGroupItems}}
|
|
2
|
+
{{#>components/grid/grid_group_highlight _backgroundColor="1" }}
|
|
3
|
+
{{~#if this.hasGroupTitle}}
|
|
4
|
+
<{{if this.headlineTag this.headlineTag "h2"}} class="text-2xl {{#unless
|
|
5
|
+
this.isRelatedContent}} md:text-5xl{{else}} justifyLine{{/unless}} col-span-full py-0 font-title {{#if
|
|
6
|
+
this.backgroundColor}} text-center{{else}} headline-barrier{{/if}}">
|
|
7
|
+
{{~#if this.hasLink}}<a class="{{if (isUserConsentNeeded this.link.url) 'js-user-consent-needed '
|
|
8
|
+
''}}no-underline hover:underline decoration-1 md:decoration-2 text-link"
|
|
9
|
+
href="{{this.link.url}}">{{/if~}}
|
|
10
|
+
{{this.groupTitle}}
|
|
11
|
+
{{~#if this.hasLink}}</a>{{/if~}}
|
|
12
|
+
</{{if this.headlineTag this.headlineTag "h2"}}>
|
|
13
|
+
{{/if}}
|
|
14
|
+
<div class="grid items-start content-start grid-cols-12 col-span-12 gap-y-10 md:gap-y-14{{#if
|
|
15
|
+
this.isRelatedContent}} js-load{{/if}}{{inline-switch this.teaserSize '["25"]' '[""," gap-x-6"]'}}"
|
|
16
|
+
{{#if this.isRelatedContent}}
|
|
17
|
+
data-hr-click-tracking='{"settings": [{"type": "uxAction", "clickLabel": "Related-Content geklickt"}]}'{{/if}}
|
|
18
|
+
>
|
|
19
|
+
<div class="flex col-span-full">
|
|
20
|
+
<div class="overflow-x-auto no-scrollbar [scroll-snap-type:x_mandatory] w-full">
|
|
21
|
+
<div class="flex w-full gap-4 sm:justify-between">
|
|
22
|
+
{{~> components/teaser/teaser_logic/teaser_logic ~}}
|
|
23
|
+
</div>
|
|
24
|
+
</div>
|
|
25
|
+
</div>
|
|
26
|
+
</div>
|
|
27
|
+
{{/components/grid/grid_group_highlight }}
|
|
28
|
+
{{/if}}
|
|
@@ -43,4 +43,7 @@ absolute
|
|
|
43
43
|
{{~#case 'ticker-alternative'~}}
|
|
44
44
|
{{~inline-switch _teaserSize '["hero","100","50"]' '[" m-4"," m-2 md:m-3"," m-2"]'~}}
|
|
45
45
|
{{~/case~}}
|
|
46
|
+
{{~#case 'video-vertical'~}}
|
|
47
|
+
{{~inline-switch _teaserSize '["25"]' '[" m-2 md:m-3"," m-2 md:m-3"]'~}}
|
|
48
|
+
{{~/case~}}
|
|
46
49
|
{{~/switch~}}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
<article class="shrink-0 w-[90vw] sm:w-[calc(25%-12px)] rounded-lg [scroll-snap-align:start]" x-data="{ avStart: false }">
|
|
2
|
+
<section class="bg-white">
|
|
3
|
+
<div class="relative">
|
|
4
|
+
<figure class="{{> components/teaser/utilities/teaser_image_cypress_hook_classes}} relative ar-9-16 w-full" >
|
|
5
|
+
{{#with this.toModel.videoElement}}
|
|
6
|
+
{{~> components/mediaplayer/media_player _playerLocation="Teaser" _uiTestHook="ui-test-video-ondemand-player" _isUsedInTeaser=true _addClassImg=../../_addClassImg~}}
|
|
7
|
+
{{~> components/teaser/components/teaser_media_player ../../this _isVertical=true _playerId=this.ardPlayerConfig.playerId _mediaButtonIcon="play_button" _mediaButtonLabel="Video" _aspectRatio="ar-9-16" _addClassImg="" }}
|
|
8
|
+
{{/with}}
|
|
9
|
+
</figure>
|
|
10
|
+
<div class="absolute left-0 w-full pr-2 bottom-16">
|
|
11
|
+
<span class="w-full px-2 py-1 text-lg text-white hyphens-limit-15 bg-primary box-decoration-clone font-title ">
|
|
12
|
+
{{this.title }}
|
|
13
|
+
</span>
|
|
14
|
+
</div>
|
|
15
|
+
</div>
|
|
16
|
+
<p class="mt-2 ml-2 text-xs sm:ml-0 text-gray-scorpion font-headingSerif empty:hidden overflow-anywhere hyphens-auto">{{_meta}}</p>
|
|
17
|
+
</section>
|
|
18
|
+
</article>
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
{{#if this.hasGroupItems}}
|
|
2
|
+
{{#>components/grid/grid_group_highlight _backgroundColor="1" }}
|
|
3
|
+
{{~#if this.hasGroupTitle}}
|
|
4
|
+
<{{if this.headlineTag this.headlineTag "h2"}} class="text-2xl {{#unless
|
|
5
|
+
this.isRelatedContent}} md:text-5xl{{else}} justifyLine{{/unless}} col-span-full py-0 font-title {{#if
|
|
6
|
+
this.backgroundColor}} text-center{{else}} headline-barrier{{/if}}">
|
|
7
|
+
{{~#if this.hasLink}}<a class="{{if (isUserConsentNeeded this.link.url) 'js-user-consent-needed '
|
|
8
|
+
''}}no-underline hover:underline decoration-1 md:decoration-2 text-link"
|
|
9
|
+
href="{{this.link.url}}">{{/if~}}
|
|
10
|
+
{{this.groupTitle}}
|
|
11
|
+
{{~#if this.hasLink}}</a>{{/if~}}
|
|
12
|
+
</{{if this.headlineTag this.headlineTag "h2"}}>
|
|
13
|
+
{{/if}}
|
|
14
|
+
<div class="grid items-start content-start grid-cols-12 col-span-12 gap-y-10 md:gap-y-14{{#if
|
|
15
|
+
this.isRelatedContent}} js-load{{/if}}{{inline-switch this.teaserSize '["25"]' '[""," gap-x-6"]'}}"
|
|
16
|
+
{{#if this.isRelatedContent}}
|
|
17
|
+
data-hr-click-tracking='{"settings": [{"type": "uxAction", "clickLabel": "Related-Content geklickt"}]}'{{/if}}
|
|
18
|
+
>
|
|
19
|
+
<div class="flex col-span-full">
|
|
20
|
+
<div class="overflow-x-auto no-scrollbar [scroll-snap-type:x_mandatory] w-full">
|
|
21
|
+
<div class="flex w-full gap-4 sm:justify-between">
|
|
22
|
+
{{~> components/teaser/teaser_logic/teaser_logic ~}}
|
|
23
|
+
</div>
|
|
24
|
+
</div>
|
|
25
|
+
</div>
|
|
26
|
+
</div>
|
|
27
|
+
{{/components/grid/grid_group_highlight }}
|
|
28
|
+
{{/if}}
|
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.114.
|
|
9
|
+
"version": "1.114.144",
|
|
10
10
|
"scripts": {
|
|
11
11
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
12
12
|
"storybook": "storybook dev -p 6006 public",
|
|
@@ -43,4 +43,7 @@ absolute
|
|
|
43
43
|
{{~#case 'ticker-alternative'~}}
|
|
44
44
|
{{~inline-switch _teaserSize '["hero","100","50"]' '[" m-4"," m-2 md:m-3"," m-2"]'~}}
|
|
45
45
|
{{~/case~}}
|
|
46
|
+
{{~#case 'video-vertical'~}}
|
|
47
|
+
{{~inline-switch _teaserSize '["25"]' '[" m-2 md:m-3"," m-2 md:m-3"]'~}}
|
|
48
|
+
{{~/case~}}
|
|
46
49
|
{{~/switch~}}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
<article class="shrink-0 w-[90vw] sm:w-[calc(25%-12px)] rounded-lg [scroll-snap-align:start]" x-data="{ avStart: false }">
|
|
2
|
+
<section class="bg-white">
|
|
3
|
+
<div class="relative">
|
|
4
|
+
<figure class="{{> components/teaser/utilities/teaser_image_cypress_hook_classes}} relative ar-9-16 w-full" >
|
|
5
|
+
{{#with this.toModel.videoElement}}
|
|
6
|
+
{{~> components/mediaplayer/media_player _playerLocation="Teaser" _uiTestHook="ui-test-video-ondemand-player" _isUsedInTeaser=true _addClassImg=../../_addClassImg~}}
|
|
7
|
+
{{~> components/teaser/components/teaser_media_player ../../this _isVertical=true _playerId=this.ardPlayerConfig.playerId _mediaButtonIcon="play_button" _mediaButtonLabel="Video" _aspectRatio="ar-9-16" _addClassImg="" }}
|
|
8
|
+
{{/with}}
|
|
9
|
+
</figure>
|
|
10
|
+
<div class="absolute left-0 w-full pr-2 bottom-16">
|
|
11
|
+
<span class="w-full px-2 py-1 text-lg text-white hyphens-limit-15 bg-primary box-decoration-clone font-title ">
|
|
12
|
+
{{this.title }}
|
|
13
|
+
</span>
|
|
14
|
+
</div>
|
|
15
|
+
</div>
|
|
16
|
+
<p class="mt-2 ml-2 text-xs sm:ml-0 text-gray-scorpion font-headingSerif empty:hidden overflow-anywhere hyphens-auto">{{_meta}}</p>
|
|
17
|
+
</section>
|
|
18
|
+
</article>
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
{{#if this.hasGroupItems}}
|
|
2
|
+
{{#>components/grid/grid_group_highlight _backgroundColor="1" }}
|
|
3
|
+
{{~#if this.hasGroupTitle}}
|
|
4
|
+
<{{if this.headlineTag this.headlineTag "h2"}} class="text-2xl {{#unless
|
|
5
|
+
this.isRelatedContent}} md:text-5xl{{else}} justifyLine{{/unless}} col-span-full py-0 font-title {{#if
|
|
6
|
+
this.backgroundColor}} text-center{{else}} headline-barrier{{/if}}">
|
|
7
|
+
{{~#if this.hasLink}}<a class="{{if (isUserConsentNeeded this.link.url) 'js-user-consent-needed '
|
|
8
|
+
''}}no-underline hover:underline decoration-1 md:decoration-2 text-link"
|
|
9
|
+
href="{{this.link.url}}">{{/if~}}
|
|
10
|
+
{{this.groupTitle}}
|
|
11
|
+
{{~#if this.hasLink}}</a>{{/if~}}
|
|
12
|
+
</{{if this.headlineTag this.headlineTag "h2"}}>
|
|
13
|
+
{{/if}}
|
|
14
|
+
<div class="grid items-start content-start grid-cols-12 col-span-12 gap-y-10 md:gap-y-14{{#if
|
|
15
|
+
this.isRelatedContent}} js-load{{/if}}{{inline-switch this.teaserSize '["25"]' '[""," gap-x-6"]'}}"
|
|
16
|
+
{{#if this.isRelatedContent}}
|
|
17
|
+
data-hr-click-tracking='{"settings": [{"type": "uxAction", "clickLabel": "Related-Content geklickt"}]}'{{/if}}
|
|
18
|
+
>
|
|
19
|
+
<div class="flex col-span-full">
|
|
20
|
+
<div class="overflow-x-auto no-scrollbar [scroll-snap-type:x_mandatory] w-full">
|
|
21
|
+
<div class="flex w-full gap-4 sm:justify-between">
|
|
22
|
+
{{~> components/teaser/teaser_logic/teaser_logic ~}}
|
|
23
|
+
</div>
|
|
24
|
+
</div>
|
|
25
|
+
</div>
|
|
26
|
+
</div>
|
|
27
|
+
{{/components/grid/grid_group_highlight }}
|
|
28
|
+
{{/if}}
|