hr-design-system-handlebars 0.105.0 → 0.105.2

package/CHANGELOG.md

@@ -1,3 +1,28 @@
+# v0.105.2 (Mon Dec 12 2022)
+
+#### 🐛 Bug Fix
+
+- Dpe 1803 [#430](https://github.com/mumprod/hr-design-system-handlebars/pull/430) ([@vascoeduardo](https://github.com/vascoeduardo))
+
+#### Authors: 1
+
+- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
+
+---
+
+# v0.105.1 (Mon Dec 12 2022)
+
+#### 🐛 Bug Fix
+
+- Add Story "Meistgeklickt-Box mit langem Titel" [#429](https://github.com/mumprod/hr-design-system-handlebars/pull/429) (saad.elbaciri@hr.de [@selbaciri](https://github.com/selbaciri))
+
+#### Authors: 2
+
+- Saad El Baciri ([@selbaciri](https://github.com/selbaciri))
+- selbaciri (saad.elbaciri@hr.de)
+
+---
+
 # v0.105.0 (Mon Dec 12 2022)
 
 #### 🚀 Enhancement

package/dist/assets/index.css

@@ -539,29 +539,18 @@ video {
   line-height: 1.5rem;
 }
 .headline-barrier {
-        display: flex;
-        width: 100%;
-        justify-content: center;
+        display: grid;
+        grid-template-columns: minmax(20px, 1fr) auto minmax(20px, 1fr);
         align-items: center;
         text-align: center;
+        grid-gap: 10px;
+        width: 100%;
     }
 .headline-barrier:before,
     .headline-barrier:after {
-        content: '';
+ 
         border-top: 1px solid;
-        margin: 3px 10px 0 0;
-        flex: 1 0 20px;
-    }
-.headline-barrier:after {
-        margin: 3px 0 0 10px;
-    }
-@media (min-width: 768px) {
-        .headline-barrier:after {
-            margin: 3px 0 0 20px;
-        }
-        .headline-barrier:before {
-            margin: 3px 20px 0 0;
-        }
+        content: '';      
     }
 /* PODCAST SEEK SLIDER*/
 .seek_slider::-webkit-slider-thumb {
@@ -1264,6 +1253,9 @@ video {
 .gap-y-10 {
   row-gap: 2.5rem;
 }
+.gap-y-5 {
+  row-gap: 1.25rem;
+}
 .gap-y-3 {
   row-gap: 0.75rem;
 }
@@ -1271,9 +1263,6 @@ video {
   -moz-column-gap: 1rem;
        column-gap: 1rem;
 }
-.gap-y-5 {
-  row-gap: 1.25rem;
-}
 .gap-y-4 {
   row-gap: 1rem;
 }
@@ -2208,7 +2197,7 @@ video {
   transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
 }
 .counter-reset {
-  counter-reset: cnt1670838056332;
+  counter-reset: cnt1670850905649;
 }
 .line-clamp-4 {
   overflow: hidden;
@@ -2440,7 +2429,7 @@ video {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1670838056332 1;
+  counter-increment: cnt1670850905649 1;
 }
 .-ordered::before {
   position: absolute;
@@ -2456,7 +2445,7 @@ video {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1670838056332);
+  content: counter(cnt1670850905649);
 }
 /*! ****************************/
 /*! text-shadow                */

package/dist/views/components/grid/grid_group_standard.hbs

@@ -1,3 +1,3 @@
-<section class="grid grid-cols-12 first:mt-6 items-start bg-white content-start gap-x-6 gap-y-6 col-span-12 {{inline-switch _size '["100","66","50","33","25"]' '["","md:col-span-8","md:col-span-6","md:col-span-4","md:col-span-3"]'}}">
+<section class="grid grid-cols-12 first:mt-6 items-start bg-white content-start gap-x-6 gap-y-5 col-span-12 {{inline-switch _size '["100","66","50","33","25"]' '["","md:col-span-8","md:col-span-6","md:col-span-4","md:col-span-3"]'}}">
     {{> @partial-block }}
 </section>

package/package.json

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

package/src/assets/css/custom-components.css

@@ -30,33 +30,20 @@
     .btn--xl {
         @apply px-6 py-3 text-lg;
     }
+
     .headline-barrier {
-        display: flex;
-        width: 100%;
-        justify-content: center;
+        display: grid;
+        grid-template-columns: minmax(20px, 1fr) auto minmax(20px, 1fr);
         align-items: center;
         text-align: center;
+        grid-gap: 10px;
+        width: 100%;
     }
-
     .headline-barrier:before,
     .headline-barrier:after {
-        content: '';
+ 
         border-top: 1px solid;
-        margin: 3px 10px 0 0;
-        flex: 1 0 20px;
-    }
-
-    .headline-barrier:after {
-        margin: 3px 0 0 10px;
-    }
-
-    @media screen(md) {
-        .headline-barrier:after {
-            margin: 3px 0 0 20px;
-        }
-        .headline-barrier:before {
-            margin: 3px 20px 0 0;
-        }
+        content: '';      
     }
 
     /* PODCAST SEEK SLIDER*/

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

@@ -0,0 +1,25 @@
+{
+    "@->jsoninclude": "teaser/teaser_cluster.inc.json",
+    "@->overrides": [
+        {
+            "@->contentpath": "teaserSize",
+            "@->value": "33"
+        },
+        {
+            "@->contentpath": "title",
+            "@->value": "Die meistgeklickten Artikel der Woche"
+        },
+        {
+            "@->contentpath": "teaserLogo",
+            "@->value": "hessenschau_de"
+        },
+        {
+            "@->contentpath": "isOrdered",
+            "@->value": "true"
+        },
+        {
+            "@->contentpath": "overviewLink.link",
+            "@->value": ""
+        }
+    ]
+}

package/src/stories/views/components/grid/grid_group_standard.hbs

@@ -1,3 +1,3 @@
-<section class="grid grid-cols-12 first:mt-6 items-start bg-white content-start gap-x-6 gap-y-6 col-span-12 {{inline-switch _size '["100","66","50","33","25"]' '["","md:col-span-8","md:col-span-6","md:col-span-4","md:col-span-3"]'}}">
+<section class="grid grid-cols-12 first:mt-6 items-start bg-white content-start gap-x-6 gap-y-5 col-span-12 {{inline-switch _size '["100","66","50","33","25"]' '["","md:col-span-8","md:col-span-6","md:col-span-4","md:col-span-3"]'}}">
     {{> @partial-block }}
 </section>

package/src/stories/views/components/teaser/cluster/teaser_cluster.stories.mdx

@@ -17,6 +17,7 @@ import clusterTeaserImage100 from '../fixtures/cluster_teaser_100_image.json'
 import clusterTeaserImage50 from '../fixtures/cluster_teaser_50_image.json'
 import clusterTeaserImage33 from '../fixtures/cluster_teaser_33_image.json'
 import PodcastChannelClusterTeaser from '../fixtures/cluster_teaser_Podcast_Channel.json'
+import clusterTeaserOrdered33LongTitle from '../fixtures/cluster_teaser_33_long_title.json'
 
 <Meta   title="Komponenten/Teaser/Cluster"
         parameters={{
@@ -92,4 +93,7 @@ export const Template = (args, { globals: { customConditionalToolbar } }) => {
     <Story name="PodcastEpisoden ClusterTeaser" args={PodcastChannelClusterTeaser}>
         {Template.bind({})}
     </Story>
+    <Story name="Meistgeklickt-Box mit langem Titel" args={clusterTeaserOrdered33LongTitle}>
+        {Template.bind({})}
+    </Story>
 </Preview>

package/src/stories/views/components/teaser/fixtures/cluster_teaser_33_long_title.json

@@ -0,0 +1 @@
+{"title":"Die meistgeklickten Artikel der Woche","teaserLogo":"hessenschau_de","showFirstImageOrGenreImage":false,"hideTitle":false,"showGenreImage":false,"showFirstImage":false,"isOrdered":"true","teaserSize":"33","genreImage":{"alttext":"Lorem ipsum","copyrightWithLinks":"","responsiveImage":{"asPicture":true,"asImage":false,"fallback":"images/buchmesse-fahnen-102_v-16to9__medium.jpg","sources":[{"media":"all and (max-width: 47.938em)","srcset":"images/buchmesse-fahnen-102_v-16to9__small.jpg 320w, images/buchmesse-fahnen-102_v-16to9__medium.jpg 480w, images/buchmesse-fahnen-102_v-16to9__medium__extended.jpg 640w, images/buchmesse-fahnen-102_v-16to9.jpg 960w, images/buchmesse-fahnen-102_v-16to9__retina.jpg 1920w"},{"media":"all and (min-width: 48em)","srcset":"images/buchmesse-fahnen-102_v-1to1__small.jpg 380w, images/buchmesse-fahnen-102_v-1to1__medium.jpg 480w, images/buchmesse-fahnen-102_v-1to1.jpg 720w, images/buchmesse-fahnen-102_v-1to1__large.jpg 960w"}]}},"teaserType":"headlinelist","aspectRatio":"ar-16-9","imageVariant":"33","firstEntry":{"title":"Mann in Heusenstamm von S-Bahn erfasst - tot","url":"/teaser1","teaserImage":{"alttext":"Lorem ipsum","copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/connichi-106_v-16to9__medium.jpg","sources":[{"media":"(min-width: 768px) 300px, (min-width: 640px) calc(100vw - 8.5rem), calc(100vw - 2,5rem)","srcset":"images/connichi-106_v-16to9__small.jpg 320w, images/connichi-106_v-16to9__medium.jpg 480w, images/connichi-106_v-16to9__medium__extended.jpg 640w, images/connichi-106_v-16to9.jpg 960w, images/connichi-106_v-16to9__retina.jpg 1920w"}]}},"teaserSize":"hero","showLabel":false,"showProfileInfo":false,"teaserInfo":{"showTeaserInfo":true,"showTeaserInfoSection":true,"showTeaserInfoChannel":false,"showTeaserInfoAll":true,"showTeaserInfoDate":false,"showTeaserInfoDateTime":true,"showTeaserInfoProgramRef":false},"teaserDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentModificationDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentSection":"Panorama","isBroadcastDateHidden":false,"showProfileInfoAsByline":true,"profiles":"Von Petra Boberg und Christine Rütte","link":{"url":"/teaser1","webviewUrl":"/teaser1#webview","isTargetBlank":false,"hasIcon":false,"iconName":"iconName","readMoreText":{"readMoreScreenreader":"Zum Artikel","readMore":"mehr","readMoreLong":"read More Long"}},"airDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"}},"clusterTeaserItems":[{"title":"Mann in Heusenstamm von S-Bahn erfasst - tot","url":"/teaser1","teaserImage":{"alttext":"Lorem ipsum","copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/connichi-106_v-16to9__medium.jpg","sources":[{"media":"(min-width: 768px) 300px, (min-width: 640px) calc(100vw - 8.5rem), calc(100vw - 2,5rem)","srcset":"images/connichi-106_v-16to9__small.jpg 320w, images/connichi-106_v-16to9__medium.jpg 480w, images/connichi-106_v-16to9__medium__extended.jpg 640w, images/connichi-106_v-16to9.jpg 960w, images/connichi-106_v-16to9__retina.jpg 1920w"}]}},"teaserSize":"hero","showLabel":false,"showProfileInfo":false,"teaserInfo":{"showTeaserInfo":true,"showTeaserInfoSection":true,"showTeaserInfoChannel":false,"showTeaserInfoAll":true,"showTeaserInfoDate":false,"showTeaserInfoDateTime":true,"showTeaserInfoProgramRef":false},"teaserDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentModificationDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentSection":"Panorama","isBroadcastDateHidden":false,"showProfileInfoAsByline":true,"profiles":"Von Petra Boberg und Christine Rütte","link":{"url":"/teaser1","webviewUrl":"/teaser1#webview","isTargetBlank":false,"hasIcon":false,"iconName":"iconName","readMoreText":{"readMoreScreenreader":"Zum Artikel","readMore":"mehr","readMoreLong":"read More Long"}},"airDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"}},{"title":"Aktuelles von Eintracht Frankfurt & Darmstadt 98: News im Bundesliga-Ticker","url":"/teaser2","teaserImage":{"alttext":"Lorem ipsum","copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"media":"(min-width: 768px) 300px, (min-width: 640px) calc(100vw - 8.5rem), calc(100vw - 2,5rem)","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}},"teaserSize":"hero","showLabel":true,"label":{"type":"ticker","loca":"label_ticker","byline":{"bylineSsi":"BylineText aus ssi","bylineText":"BylineText"}},"showProfileInfo":false,"teaserInfo":{"showTeaserInfo":true,"showTeaserInfoSection":true,"showTeaserInfoChannel":false,"showTeaserInfoAll":true,"showTeaserInfoDate":false,"showTeaserInfoDateTime":true,"showTeaserInfoProgramRef":false},"teaserDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentModificationDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentSection":"Sport","isBroadcastDateHidden":false,"showProfileInfoAsByline":false,"link":{"url":"/teaser2","webviewUrl":"/teaser2#webview","isTargetBlank":false,"hasIcon":false,"iconName":"iconName","readMoreText":{"readMoreScreenreader":"Zum Artikel","readMore":"mehr","readMoreLong":"read More Long"}},"airDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"}},{"title":"Youth League: Eintracht-U19 spielt unentschieden gegen Lissabon","url":"/teaser3","teaserImage":{"alttext":"Lorem ipsum","copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/hasebe-kane-102_v-16to9__medium.jpg","sources":[{"media":"(min-width: 768px) 300px, (min-width: 640px) calc(100vw - 8.5rem), calc(100vw - 2,5rem)","srcset":"images/hasebe-kane-102_v-16to9__small.jpg 320w, images/hasebe-kane-102_v-16to9__medium.jpg 480w, images/hasebe-kane-102_v-16to9__medium__extended.jpg 640w, images/hasebe-kane-102_v-16to9.jpg 960w, images/hasebe-kane-102_v-16to9__retina.jpg 1920w"}]}},"teaserSize":"hero","showLabel":true,"showProfileInfo":false,"teaserInfo":{"showTeaserInfo":true,"showTeaserInfoSection":true,"showTeaserInfoChannel":false,"showTeaserInfoAll":true,"showTeaserInfoDate":false,"showTeaserInfoDateTime":true,"showTeaserInfoProgramRef":false},"teaserDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentModificationDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentSection":"Sport","isBroadcastDateHidden":false,"showProfileInfoAsByline":false,"link":{"url":"/teaser3","webviewUrl":"/teaser3#webview","isTargetBlank":false,"hasIcon":false,"iconName":"iconName","readMoreText":{"readMoreScreenreader":"Zum Artikel","readMore":"mehr","readMoreLong":"read More Long"}},"airDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"}},{"title":"Radfahrer stößt in Frankfurter U-Bahn","url":"/teaser4","teaserImage":{"alttext":"Lorem ipsum","copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/mercedes-suv-g-100_v-16to9__medium.jpg","sources":[{"media":"(min-width: 768px) 300px, (min-width: 640px) calc(100vw - 8.5rem), calc(100vw - 2,5rem)","srcset":"images/mercedes-suv-g-100_v-16to9__small.jpg 320w, images/mercedes-suv-g-100_v-16to9__medium.jpg 480w, images/mercedes-suv-g-100_v-16to9__medium__extended.jpg 640w, images/mercedes-suv-g-100_v-16to9.jpg 960w, images/mercedes-suv-g-100_v-16to9__retina.jpg 1920w"}]}},"teaserSize":"hero","showLabel":true,"showProfileInfo":false,"teaserInfo":{"showTeaserInfo":true,"showTeaserInfoSection":true,"showTeaserInfoChannel":false,"showTeaserInfoAll":true,"showTeaserInfoDate":false,"showTeaserInfoDateTime":true,"showTeaserInfoProgramRef":false},"teaserDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentModificationDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentSection":"Panorama","isBroadcastDateHidden":false,"showProfileInfoAsByline":false,"link":{"url":"/teaser4","webviewUrl":"/teaser4#webview","isTargetBlank":false,"hasIcon":false,"iconName":"iconName","readMoreText":{"readMoreScreenreader":"Zum Artikel","readMore":"mehr","readMoreLong":"read More Long"}},"airDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"}},{"title":"Wegen Personalmangel: Hessen lockert Einstellungskriterien für Richter","url":"/teaser5","teaserImage":{"alttext":"Lorem ipsum","copyrightWithLinks":"","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/jugendfeuerwehr-1020_v-16to9__medium.jpg","sources":[{"media":"(min-width: 768px) 300px, (min-width: 640px) calc(100vw - 8.5rem), calc(100vw - 2,5rem)","srcset":"images/jugendfeuerwehr-1020_v-16to9__small.jpg 320w, images/jugendfeuerwehr-1020_v-16to9__medium.jpg 480w, images/jugendfeuerwehr-1020_v-16to9__medium__extended.jpg 640w, images/jugendfeuerwehr-1020_v-16to9.jpg 960w, images/jugendfeuerwehr-1020_v-16to9__retina.jpg 1920w"}]}},"teaserSize":"hero","showLabel":true,"label":{"type":"ticker","loca":"label_ticker","byline":{"bylineSsi":"BylineText aus ssi","bylineText":"BylineText"}},"showProfileInfo":false,"teaserInfo":{"showTeaserInfo":true,"showTeaserInfoSection":true,"showTeaserInfoChannel":false,"showTeaserInfoAll":true,"showTeaserInfoDate":false,"showTeaserInfoDateTime":true,"showTeaserInfoProgramRef":false},"teaserDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentModificationDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"},"documentSection":"Politik","isBroadcastDateHidden":false,"showProfileInfoAsByline":false,"link":{"url":"/teaser5","webviewUrl":"/teaser5#webview","isTargetBlank":false,"hasIcon":false,"iconName":"iconName","readMoreText":{"readMoreScreenreader":"Zum Artikel","readMore":"mehr","readMoreLong":"read More Long"}},"airDate":{"htmlDateTime":"2022-04-17T19:30+0200","htmlDate":"20.02.1983","date":"17.04.22","dateSeparatorTime":"17.04.22, 19:30"}}],"overviewLink":{"title":"Neue Beiträge auf einen Blick","link":""}}