hr-design-system-handlebars 1.1.17 → 1.3.0

package/CHANGELOG.md

@@ -1,3 +1,27 @@
+# v1.3.0 (Fri Feb 17 2023)
+
+#### 🚀 Enhancement
+
+- BUGFIX: Shorttext is not shown on 25 teasers only if its an external … [#557](https://github.com/mumprod/hr-design-system-handlebars/pull/557) ([@mariokinzel](https://github.com/mariokinzel))
+
+#### Authors: 1
+
+- [@mariokinzel](https://github.com/mariokinzel)
+
+---
+
+# v1.2.0 (Fri Feb 17 2023)
+
+#### 🚀 Enhancement
+
+- Feature/dpe 2097: Add brand colors for media_button and labels [#556](https://github.com/mumprod/hr-design-system-handlebars/pull/556) ([@mariokinzel](https://github.com/mariokinzel))
+
+#### Authors: 1
+
+- [@mariokinzel](https://github.com/mariokinzel)
+
+---
+
 # v1.1.17 (Fri Feb 17 2023)
 
 #### 🐛 Bug Fix

package/dist/assets/index.css

@@ -2438,9 +2438,9 @@ video {
   --tw-text-opacity: 1;
   color: rgba(211, 70, 0, var(--tw-text-opacity));
 }
-.text-blue-jellyBean {
-  --tw-text-opacity: 1;
-  color: rgba(39, 107, 158, var(--tw-text-opacity));
+.text-media-button {
+  color: #276b9e;
+  color: var(--color-media-button);
 }
 .text-blue-congress {
   --tw-text-opacity: 1;
@@ -2653,7 +2653,7 @@ video {
   transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
 }
 .counter-reset {
-  counter-reset: cnt1676636113964;
+  counter-reset: cnt1676644118215;
 }
 .line-clamp-4 {
   overflow: hidden;
@@ -2887,7 +2887,7 @@ video {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1676636113964 1;
+  counter-increment: cnt1676644118215 1;
 }
 .-ordered::before {
   position: absolute;
@@ -2903,7 +2903,7 @@ video {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1676636113964);
+  content: counter(cnt1676644118215);
 }
 /*! ****************************/
 /*! text-shadow                */
@@ -3007,6 +3007,8 @@ video {
     --color-button: var(--color-primary-ds);
     --color-button-inverted: #ffffff;
     --color-button-hollow: #006dc1;
+    /* Media-Button */
+    --color-media-button: #276b9e;
     /* States */
     --color-focus-state: var(--color-primary-ds);
     /* Content-Nav */
@@ -3072,6 +3074,8 @@ video {
     --color-button: var(--color-primary-ds);
     --color-button-inverted: #ffffff;
     --color-button-hollow: #006dc1;
+    /* Media-Button */
+    --color-media-button: #276b9e;
     /* States */
     --color-focus-state: var(--color-primary-ds);
     /* Content-Nav */
@@ -3095,15 +3099,15 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerie */
-    --color-label-media: #006dc1;
+    --color-label-media: #006eb7;
     /* Ticker, Live, Livestream */
-    --color-label-live: #d34600;
+    --color-label-live: #f07800;
     /* Kommentar */
-    --color-label-comment: #097d8e;
+    --color-label-comment: #017e5c;
     /* Eilmeldung */
     --color-label-breakingnews: #cc1a14;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: #a12644;
     /* Download */
     --color-label-download: #606060;
     /* Event */
@@ -3130,6 +3134,8 @@ video {
     --color-button: var(--color-primary-ds);
     --color-button-inverted: #ffffff;
     --color-button-hollow: #a00d65;
+    /* Media-Button */
+    --color-media-button: var(--color-primary-ds);
     /* States */
     --color-focus-state: var(--color-primary-ds);
     /* Content-Nav */
@@ -3149,15 +3155,15 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerie */
-    --color-label-media: #006dc1;
+    --color-label-media: #276b9e;
     /* Ticker, Live, Livestream */
-    --color-label-live: #d34600;
+    --color-label-live: #f07800;
     /* Kommentar */
-    --color-label-comment: #097d8e;
+    --color-label-comment: #017e5c;
     /* Eilmeldung */
     --color-label-breakingnews: #cc1a14;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: #e5007d;
     /* Download */
     --color-label-download: #606060;
     /* Event */
@@ -3183,6 +3189,8 @@ video {
     --color-button: var(--color-primary-ds);
     --color-button-inverted: #ffffff;
     --color-button-hollow: #276b9e;
+    /* Media-Button */
+    --color-media-button: var(--color-primary-ds);
     /* States */
     --color-focus-state: var(--color-primary-ds);
     /* Content-Nav */
@@ -3202,15 +3210,15 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerie */
-    --color-label-media: #006dc1;
+    --color-label-media: #006eb7;
     /* Ticker, Live, Livestream */
-    --color-label-live: #d34600;
+    --color-label-live: #f07800;
     /* Kommentar */
-    --color-label-comment: #097d8e;
+    --color-label-comment: #017e5c;
     /* Eilmeldung */
     --color-label-breakingnews: #cc1a14;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: #a12644;
     /* Download */
     --color-label-download: #606060;
     /* Event */
@@ -3238,6 +3246,8 @@ video {
     --color-button: #006eb7;
     --color-button-inverted: #ffffff;
     --color-button-hollow: #006eb7;
+    /* Media-Button */
+    --color-media-button: var(--color-primary-ds);
     /* States */
     --color-focus-state: #006eb7;
     /* Content-Nav */
@@ -3257,15 +3267,15 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerie */
-    --color-label-media: #006dc1;
+    --color-label-media: #006eb7;
     /* Ticker, Live, Livestream */
-    --color-label-live: #d34600;
+    --color-label-live: #f07800;
     /* Kommentar */
-    --color-label-comment: #097d8e;
+    --color-label-comment: #017e5c;
     /* Eilmeldung */
     --color-label-breakingnews: #cc1a14;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: #a12644;
     /* Download */
     --color-label-download: #606060;
     /* Event */
@@ -3293,6 +3303,8 @@ video {
     --color-button: var(--color-primary-ds);
     --color-button-inverted: #ffffff;
     --color-button-hollow: var(--color-primary-ds);
+    /* Media-Button */
+    --color-media-button: var(--color-primary-ds);
     /* States */
     --color-focus-state: var(--color-primary-ds);
     /* Content-Nav */
@@ -3312,15 +3324,15 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerie */
-    --color-label-media: #006dc1;
+    --color-label-media: #8d2725;
     /* Ticker, Live, Livestream */
-    --color-label-live: #d34600;
+    --color-label-live: #f07800;
     /* Kommentar */
-    --color-label-comment: #097d8e;
+    --color-label-comment: #017e5c;
     /* Eilmeldung */
     --color-label-breakingnews: #cc1a14;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: #6e6748;
     /* Download */
     --color-label-download: #606060;
     /* Event */
@@ -3346,6 +3358,8 @@ video {
     --color-button: rgba(171,47,45,1);
     --color-button-inverted: #ffffff;
     --color-button-hollow: rgba(171,47,45,1);
+    /* Media-Button */
+    --color-media-button: rgba(171,47,45,1);
     /* States */
     --color-focus-state: rgba(171,47,45,1);
     /* Content-Nav */
@@ -3365,15 +3379,15 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerie */
-    --color-label-media: #006dc1;
+    --color-label-media: #00646f;
     /* Ticker, Live, Livestream */
-    --color-label-live: #d34600;
+    --color-label-live: #f07800;
     /* Kommentar */
-    --color-label-comment: #097d8e;
+    --color-label-comment: #c1bc2b;
     /* Eilmeldung */
     --color-label-breakingnews: #cc1a14;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: #00646f;
     /* Download */
     --color-label-download: #606060;
     /* Event */
@@ -3399,6 +3413,8 @@ video {
     --color-button: rgba(0,122,124,1);
     --color-button-inverted: #ffffff;
     --color-button-hollow: rgba(0,122,124,1);
+    /* Media-Button */
+    --color-media-button: rgba(0,122,124,1);
     /* States */
     --color-focus-state: rgba(0,122,124,1);
     /* Content-Nav */
@@ -3418,15 +3434,15 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerie */
-    --color-label-media: #006dc1;
+    --color-label-media: #006eb7;
     /* Ticker, Live, Livestream */
-    --color-label-live: #d34600;
+    --color-label-live: #f07800;
     /* Kommentar */
     --color-label-comment: #097d8e;
     /* Eilmeldung */
     --color-label-breakingnews: #cc1a14;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: #a12644;
     /* Download */
     --color-label-download: #606060;
     /* Event */
@@ -3454,6 +3470,8 @@ video {
     --color-button: var(--color-primary-ds);
     --color-button-inverted: #ffffff;
     --color-button-hollow: var(--color-primary-ds);
+    /* Media-Button */
+    --color-media-button: var(--color-primary-ds);
     /* States */
     --color-focus-state: var(--color-primary-ds);
     /* Content-Nav */
@@ -3473,17 +3491,17 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerie */
-    --color-label-media: #006dc1;
+    --color-label-media: #916B00;
     /* Ticker, Live, Livestream */
-    --color-label-live: #d34600;
+    --color-label-live: #f07800;
     /* Kommentar */
-    --color-label-comment: #097d8e;
+    --color-label-comment: #e5007d;
     /* Eilmeldung */
-    --color-label-breakingnews: #cc1a14;
+    --color-label-breakingnews: #88114b;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: #007fa0;
     /* Download */
-    --color-label-download: #606060;
+    --color-label-download: #6e675e;
     /* Event */
     --color-label-event: #000000;
     /* Kurzmeldung */
@@ -3509,6 +3527,8 @@ video {
     --color-button: #916B00;
     --color-button-inverted: #ffffff;
     --color-button-hollow: #916B00;
+    /* Media-Button */
+    --color-media-button: #916B00;
     /* States */
     --color-focus-state: #916B00;
     /* Content-Nav */
@@ -3528,15 +3548,15 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerie */
-    --color-label-media: #006dc1;
+    --color-label-media: #c95702;
     /* Ticker, Live, Livestream */
     --color-label-live: #e5007d;
     /* Kommentar */
-    --color-label-comment: #097d8e;
+    --color-label-comment: #017e5c;
     /* Eilmeldung */
     --color-label-breakingnews: #cc1a14;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: rgba(140,3,61,1);
     /* Download */
     --color-label-download: #606060;
     /* Event */
@@ -3563,6 +3583,8 @@ video {
     --color-button: rgba(140,3,61,1);
     --color-button-inverted: #ffffff;
     --color-button-hollow: rgba(140,3,61,1);
+    /* Media-Button */
+    --color-media-button: #c95702;
     /* States */
     --color-focus-state: rgba(140,3,61,1);
     /* Content-Nav */
@@ -3582,15 +3604,15 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerie */
-    --color-label-media: #006dc1;
+    --color-label-media: #c20016;
     /* Ticker, Live, Livestream */
-    --color-label-live: #d34600;
+    --color-label-live: #f07800;
     /* Kommentar */
-    --color-label-comment: #097d8e;
+    --color-label-comment: #6d761d;
     /* Eilmeldung */
-    --color-label-breakingnews: #cc1a14;
+    --color-label-breakingnews: #007179;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: #007179;
     /* Download */
     --color-label-download: #606060;
     /* Event */
@@ -3619,6 +3641,8 @@ video {
     --color-button: #9b0112;
     --color-button-inverted: #ffffff;
     --color-button-hollow: #9b0112;
+    /* Media-Button */
+    --color-media-button: var(--color-primary-ds);
     /* States */
     --color-focus-state: var(--color-primary-ds);
     /* Content-Nav */
@@ -3638,15 +3662,15 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerie */
-    --color-label-media: #006dc1;
+    --color-label-media: #168378;
     /* Ticker, Live, Livestream */
-    --color-label-live: #d34600;
+    --color-label-live: #f07800;
     /* Kommentar */
-    --color-label-comment: #097d8e;
+    --color-label-comment: #407596;
     /* Eilmeldung */
     --color-label-breakingnews: #cc1a14;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: #bf0071;
     /* Download */
     --color-label-download: #606060;
     /* Event */
@@ -3675,6 +3699,8 @@ video {
     --color-button: #29675d;
     --color-button-inverted: #ffffff;
     --color-button-hollow: #29675d;
+    /* Media-Button */
+    --color-media-button: rgba(15,97,87,1);
     /* States */
     --color-focus-state: var(--color-link);
     /* Content-Nav */
@@ -3696,15 +3722,15 @@ video {
     --color-highlight-2: #d34600;
 
     /* Medieninhalte, Video, Audio, Bildergalerien */
-    --color-label-media: #006dc1;
+    --color-label-media: #000000;
     /* Ticker, Live, Livestream */
-    --color-label-live: #d34600;
+    --color-label-live: #f07800;
     /* Kommentar */
-    --color-label-comment: #097d8e;
+    --color-label-comment: #017e5c;
     /* Eilmeldung */
     --color-label-breakingnews: #cc1a14;
     /* Sendung */
-    --color-label-program: #1B7C96;
+    --color-label-program: rgba(0,126,161,1);
     /* Download */
     --color-label-download: #606060;
     /* Event */
@@ -3731,6 +3757,8 @@ video {
     --color-button: var(--color-link);
     --color-button-inverted: #ffffff;
     --color-button-hollow: var(--color-link);
+    /* Media-Button */
+    --color-media-button: #000000;
     /* States */
     --color-focus-state: var(--color-link);
     /* Content-Nav */
@@ -3853,12 +3881,9 @@ video {
 .hover\:fill-orange-spicyCarrot:hover {
   fill: #d34600;
 }
-.hover\:fill-blue-jellyBean:hover {
+.hover\:fill-media-button:hover {
   fill: #276b9e;
-}
-.hover\:fill-toplineColor:hover {
-  fill: #006dc1;
-  fill: var(--color-topline);
+  fill: var(--color-media-button);
 }
 .hover\:text-button-hollow:hover {
   color: #006dc1;

package/dist/views/components/mediaplayer/media_player.hbs

@@ -13,7 +13,7 @@
         {{> components/button/button_round 
         _isButton="true" 
         _addClass='absolute bottom-0 right-0 fill-white hover:text-white ds-focus rounded-full js-mediaplayer__button'
-        _buttonColor=(if _isLivestream ' text-orange-spicyCarrot hover:fill-orange-spicyCarrot' ' text-blue-jellyBean hover:fill-blue-jellyBean')
+        _buttonColor=(if _isLivestream ' text-orange-spicyCarrot hover:fill-orange-spicyCarrot' ' text-media-button hover:fill-media-button')
         _teaserType=_teaserType
         _teaserSize=_teaserSize
         _isMobile1to1=_isMobile1to1

package/dist/views/components/teaser/components/teaser_body.hbs

@@ -22,19 +22,12 @@
         {{/decorator}} 
     {{/components/teaser/components/teaser_header}}
 
-    <div class="sm:px-0{{#unless this.isMobile1to1}} px-5{{/unless}}">
-        {{#switch this.teaserSize }}
-            {{#case "25"}}
-                {{#if this.isExtOrBrandLink}}
-                    {{> components/teaser/components/teaser_text _text=this.shorttext _size=this.teaserSize}}
-                {{/if}}
-                {{> components/teaser/components/teaser_byline}} 
-            {{/case}}
-
-            {{#default "default"}}
+    {{#unless this.hideBylineAndShorttext}}
+        <div class="sm:px-0{{#unless this.isMobile1to1}} px-5{{/unless}}">
+            {{#if this.shorttext}}
                 {{> components/teaser/components/teaser_text _text=this.shorttext _size=this.teaserSize}}
-                {{> components/teaser/components/teaser_byline}} 
-            {{/default}}
-        {{/switch}}   
-    </div>
+            {{/if}}
+            {{> components/teaser/components/teaser_byline}} 
+        </div>
+    {{/unless}}
 </div>

package/dist/views/components/teaser/components/teaser_image.hbs

@@ -10,7 +10,7 @@
             {{> components/button/button_round 
         _isButton="true" 
         _addClass='absolute bottom-0 right-0 fill-white hover:text-white js-mediaplayer__button'
-        _buttonColor='text-toplineColor hover:fill-toplineColor'
+        _buttonColor='text-media-button hover:fill-media-button'
         _buttonSpace=(inline-switch this.teaserSize '["25","33"]' '[" my-2 mx-2"," my-5 mx-5 md:my-3 md:mx-3"," my-5 mx-5"]')
         _showIcon=true 
         _icon='play_button' 

package/package.json

@@ -6,7 +6,7 @@
     "license": "MIT",
     "main": "dist/index.js",
     "repository": "https://github.com/szuelch/hr-design-system-handlebars",
-    "version": "1.1.17",
+    "version": "1.3.0",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",
         "storybook": "start-storybook -p 6006 public",

package/src/assets/fixtures/teaser/teaser_standard_25_serif.json

@@ -14,6 +14,10 @@
             "@->contentpath": "logicItem.includeModel.isMobile1to1",
             "@->value": "true"
         },
+        {
+            "@->contentpath": "logicItem.includeModel.shorttext",
+            "@->value": ""
+        },
         {
             "@->contentpath": "logicItem.includeModel.teaserImage",
             "@->value": {

package/src/assets/fixtures/teaser/teaser_standard_25_serif_audio.json

@@ -14,6 +14,10 @@
             "@->contentpath": "logicItem.includeModel.isMobile1to1",
             "@->value": "true"
         },
+        {
+            "@->contentpath": "logicItem.includeModel.shorttext",
+            "@->value": ""
+        },
         {
             "@->contentpath": "logicItem.includeModel.teaserImage",
             "@->value": {

package/src/assets/fixtures/teaser/teaser_standard_25_serif_audio_livestream.json

@@ -14,6 +14,10 @@
             "@->contentpath": "logicItem.includeModel.isMobile1to1",
             "@->value": "true"
         },
+        {
+            "@->contentpath": "logicItem.includeModel.shorttext",
+            "@->value": ""
+        },
         {
             "@->contentpath": "logicItem.includeModel.teaserImage",
             "@->value": {

package/src/assets/fixtures/teaser/teaser_standard_25_serif_live.json

@@ -14,6 +14,10 @@
             "@->contentpath": "logicItem.includeModel.isMobile1to1",
             "@->value": "true"
         },
+        {
+            "@->contentpath": "logicItem.includeModel.shorttext",
+            "@->value": ""
+        },
         {
             "@->contentpath": "logicItem.includeModel.teaserImage",
             "@->value": {

package/src/assets/fixtures/teaser/teaser_standard_25_serif_podcast.json

@@ -14,6 +14,10 @@
             "@->contentpath": "logicItem.includeModel.isMobile1to1",
             "@->value": "true"
         },
+        {
+            "@->contentpath": "logicItem.includeModel.shorttext",
+            "@->value": ""
+        },
         {
             "@->contentpath": "logicItem.includeModel.teaserImage",
             "@->value": {

package/src/assets/fixtures/teaser/teaser_standard_25_serif_video.json

@@ -14,6 +14,10 @@
             "@->contentpath": "logicItem.includeModel.isMobile1to1",
             "@->value": "true"
         },
+        {
+            "@->contentpath": "logicItem.includeModel.shorttext",
+            "@->value": ""
+        },
         {
             "@->contentpath": "logicItem.includeModel.teaserImage",
             "@->value": {

package/src/assets/fixtures/teaser/teaser_standard_without_teaserimage_25_serif.json

@@ -13,6 +13,10 @@
         {
             "@->contentpath": "logicItem.includeModel.isMobile1to1",
             "@->value": false
+        },
+        {
+            "@->contentpath": "logicItem.includeModel.shorttext",
+            "@->value": ""
         }
     ]
 }