hr-design-system-handlebars 0.96.0 → 0.96.2

package/CHANGELOG.md

@@ -1,3 +1,27 @@
+# v0.96.2 (Thu Dec 01 2022)
+
+#### 🐛 Bug Fix
+
+- DPE-1693 [#413](https://github.com/mumprod/hr-design-system-handlebars/pull/413) ([@vascoeduardo](https://github.com/vascoeduardo))
+
+#### Authors: 1
+
+- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
+
+---
+
+# v0.96.1 (Thu Dec 01 2022)
+
+#### 🐛 Bug Fix
+
+- add margin to Button in Tabbox-Teaser [#412](https://github.com/mumprod/hr-design-system-handlebars/pull/412) ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+#### Authors: 1
+
+- Geraldo ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+---
+
 # v0.96.0 (Thu Dec 01 2022)
 
 #### 🚀 Enhancement

package/dist/assets/index.css

@@ -769,10 +769,6 @@ video {
   margin-left: 1rem;
   margin-right: 1rem;
 }
-.mx-8 {
-  margin-left: 2rem;
-  margin-right: 2rem;
-}
 .mx-px {
   margin-left: 1px;
   margin-right: 1px;
@@ -848,6 +844,9 @@ video {
 .-mt-10 {
   margin-top: -2.5rem;
 }
+.mb-4 {
+  margin-bottom: 1rem;
+}
 .mb-7 {
   margin-bottom: 1.75rem;
 }
@@ -2259,7 +2258,7 @@ video {
           transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
 }
 .counter-reset {
-  counter-reset: cnt1669908627308;
+  counter-reset: cnt1669913005168;
 }
 .line-clamp-4 {
   overflow: hidden;
@@ -2659,7 +2658,7 @@ video {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1669908627308 1;
+  counter-increment: cnt1669913005168 1;
 }
 .-ordered::before {
   position: absolute;
@@ -2675,7 +2674,7 @@ video {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1669908627308);
+  content: counter(cnt1669913005168);
 }
 .\[-T\:\+Z\] {
   --t: +Z;
@@ -3371,9 +3370,21 @@ video {
 }
 @media (min-width: 360px) {
 
+  .xs\:mx-6 {
+    margin-left: 1.5rem;
+    margin-right: 1.5rem;
+  }
+
   .xs\:w-24 {
     width: 6rem;
   }
+
+  .xs\:line-clamp-6 {
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 6;
+  }
 }
 @media (min-width: 640px) {
 
@@ -3382,6 +3393,11 @@ video {
     margin-right: 0px;
   }
 
+  .sm\:mx-8 {
+    margin-left: 2rem;
+    margin-right: 2rem;
+  }
+
   .sm\:block {
     display: block;
   }
@@ -3520,6 +3536,10 @@ video {
     margin-top: -10rem;
   }
 
+  .md\:mb-8 {
+    margin-bottom: 2rem;
+  }
+
   .md\:mb-16 {
     margin-bottom: 4rem;
   }
@@ -3861,6 +3881,13 @@ video {
             filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
   }
 
+  .md\:line-clamp-4 {
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 4;
+  }
+
   .md\:line-clamp-2 {
     overflow: hidden;
     display: -webkit-box;
@@ -4032,6 +4059,11 @@ video {
             order: 4;
   }
 
+  .lg\:mx-8 {
+    margin-left: 2rem;
+    margin-right: 2rem;
+  }
+
   .lg\:-mt-8 {
     margin-top: -2rem;
   }
@@ -4367,6 +4399,13 @@ video {
             transition-duration: 500ms;
   }
 
+  .lg\:line-clamp-5 {
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 5;
+  }
+
     .lg\:col-main {
         grid-column: main;
     }

package/dist/views/components/button/button_round_classes.hbs

@@ -21,4 +21,26 @@
             ~}}
         {{~/if~}}
     {{~/case~}}
+    {{~#case 'tabbox-standard-ds'~}}
+        {{~#if _isMobile1to1~}}
+            {{~inline-switch
+                _teaserSize '["25","33"]' '[" my-2 mx-2"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2 md:my-5 md:mx-5 "]'
+            ~}}
+        {{~else~}}
+            {{~inline-switch
+                _teaserSize '["25","33"]' '[" my-2 mx-2"," my-5 mx-5 md:my-3 md:mx-3"," my-5 mx-5"]'
+            ~}}
+        {{~/if~}}
+    {{~/case~}}
+    {{~#case 'tabbox-alternative-ds'~}}
+        {{~#if _isMobile1to1~}}
+            {{~inline-switch
+                _teaserSize '["hero","100","50"]' '[" my-2 mx-2 md:my-5 md:mx-5"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2"]'
+            ~}}
+        {{~else~}}
+            {{~inline-switch
+                _teaserSize '["hero","100","50"]' '[" my-5 mx-5"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2"]'
+            ~}}
+        {{~/if~}}
+    {{~/case~}}
 {{~/switch~}}

package/dist/views/components/teaser/tabbox/group_tabbox.hbs

@@ -1,4 +1,5 @@
 <section 
+    x-cloak 
     x-show="tab === '{{this.groupTitle}}'"
     class="pb-10"
 >

package/dist/views/components/teaser/tabbox/teaser_tabbox.hbs

@@ -1,5 +1,6 @@
 </div>
 <div 
+  x-cloak 
   x-data="{ tab: '{{this.tabbedGroup.[0].title}}' }"
   class="grid grid-cols-12 pt-6 mx-0 col-full md:pt-7 bg-blue-accented md:rounded-tl-3xl md:rounded-br-3xl md:col-main gap-x-6 gap-y-6"
 >

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

@@ -3,7 +3,7 @@
         {{~> components/base/image/responsive_image this.teaserImage _type=this.teaserType _variant=this.content.imageVariant _noDelay=../_noDelay _addClassImg="ar__content rounded-tl-3xl rounded-br-3xl" ~}}
     </figure> 
     <div class="absolute flex justify-center w-full h-full bg-gradient-to-t from-black rounded-tl-3xl rounded-br-3xl" aria-hidden="true">
-        <div class="self-center block mx-8 text-center text-white">
+        <div class="self-center block mx-4 mb-4 text-center text-white md:mb-8 xs:mx-6 sm:mx-8 md:mx-5 lg:mx-8 line-clamp-4 xs:line-clamp-6 md:line-clamp-4 lg:line-clamp-5">
             {{> components/teaser/components/teaser_heading _headlineTag="h2" _label=this.label _readMore=this.link.readMoreText.readMoreScreenreader _size=this.teaserSize _title=this.title _topline=this.topline _teaserType=this.teaserType _font=(inline-switch isSerifHeading '[true, false]' '["font-headingSerif","font-heading font-bold"]') }}   
         </div>
     </div>

package/package.json

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

package/src/stories/views/components/button/button_round_classes.hbs

@@ -21,4 +21,26 @@
             ~}}
         {{~/if~}}
     {{~/case~}}
+    {{~#case 'tabbox-standard-ds'~}}
+        {{~#if _isMobile1to1~}}
+            {{~inline-switch
+                _teaserSize '["25","33"]' '[" my-2 mx-2"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2 md:my-5 md:mx-5 "]'
+            ~}}
+        {{~else~}}
+            {{~inline-switch
+                _teaserSize '["25","33"]' '[" my-2 mx-2"," my-5 mx-5 md:my-3 md:mx-3"," my-5 mx-5"]'
+            ~}}
+        {{~/if~}}
+    {{~/case~}}
+    {{~#case 'tabbox-alternative-ds'~}}
+        {{~#if _isMobile1to1~}}
+            {{~inline-switch
+                _teaserSize '["hero","100","50"]' '[" my-2 mx-2 md:my-5 md:mx-5"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2"]'
+            ~}}
+        {{~else~}}
+            {{~inline-switch
+                _teaserSize '["hero","100","50"]' '[" my-5 mx-5"," my-2 mx-2 md:my-3 md:mx-3"," my-2 mx-2"]'
+            ~}}
+        {{~/if~}}
+    {{~/case~}}
 {{~/switch~}}

package/src/stories/views/components/teaser/tabbox/group_tabbox.hbs

@@ -1,4 +1,5 @@
 <section 
+    x-cloak 
     x-show="tab === '{{this.groupTitle}}'"
     class="pb-10"
 >

package/src/stories/views/components/teaser/tabbox/teaser_tabbox.hbs

@@ -1,5 +1,6 @@
 </div>
 <div 
+  x-cloak 
   x-data="{ tab: '{{this.tabbedGroup.[0].title}}' }"
   class="grid grid-cols-12 pt-6 mx-0 col-full md:pt-7 bg-blue-accented md:rounded-tl-3xl md:rounded-br-3xl md:col-main gap-x-6 gap-y-6"
 >

package/src/stories/views/components/teaser/teaser_poster.hbs

@@ -3,7 +3,7 @@
         {{~> components/base/image/responsive_image this.teaserImage _type=this.teaserType _variant=this.content.imageVariant _noDelay=../_noDelay _addClassImg="ar__content rounded-tl-3xl rounded-br-3xl" ~}}
     </figure> 
     <div class="absolute flex justify-center w-full h-full bg-gradient-to-t from-black rounded-tl-3xl rounded-br-3xl" aria-hidden="true">
-        <div class="self-center block mx-8 text-center text-white">
+        <div class="self-center block mx-4 mb-4 text-center text-white md:mb-8 xs:mx-6 sm:mx-8 md:mx-5 lg:mx-8 line-clamp-4 xs:line-clamp-6 md:line-clamp-4 lg:line-clamp-5">
             {{> components/teaser/components/teaser_heading _headlineTag="h2" _label=this.label _readMore=this.link.readMoreText.readMoreScreenreader _size=this.teaserSize _title=this.title _topline=this.topline _teaserType=this.teaserType _font=(inline-switch isSerifHeading '[true, false]' '["font-headingSerif","font-heading font-bold"]') }}   
         </div>
     </div>