hr-design-system-handlebars 0.42.2 → 0.42.3

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# v0.42.3 (Tue Apr 12 2022)
+
+#### 🐛 Bug Fix
+
+- add byline-component [#212](https://github.com/mumprod/hr-design-system-handlebars/pull/212) ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+#### Authors: 1
+
+- Geraldo ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+---
+
 # v0.42.2 (Mon Apr 11 2022)
 
 #### 🐛 Bug Fix

package/dist/assets/index.css

@@ -1514,15 +1514,15 @@ Ensure the default browser behavior of the `hidden` attribute.
 .-mt-10 {
     margin-top: -2.5rem;
 }
-.mt-1 {
-    margin-top: 0.25rem;
-}
 .mb-4 {
     margin-bottom: 1rem;
 }
 .mt-4 {
     margin-top: 1rem;
 }
+.mt-1 {
+    margin-top: 0.25rem;
+}
 .mt-0\.5 {
     margin-top: 0.125rem;
 }
@@ -2212,22 +2212,22 @@ Ensure the default browser behavior of the `hidden` attribute.
     --tw-text-opacity: 1;
     color: rgba(0, 82, 147, var(--tw-text-opacity));
 }
-.text-gray-500 {
+.text-grey-scorpion {
     --tw-text-opacity: 1;
-    color: rgba(107, 114, 128, var(--tw-text-opacity));
+    color: rgba(96, 96, 96, var(--tw-text-opacity));
 }
 .text-indigo-500 {
     --tw-text-opacity: 1;
     color: rgba(99, 102, 241, var(--tw-text-opacity));
 }
+.text-gray-500 {
+    --tw-text-opacity: 1;
+    color: rgba(107, 114, 128, var(--tw-text-opacity));
+}
 .text-toplineColor {
     color: #006dc1;
     color: var(--color-topline);
 }
-.text-grey-scorpion {
-    --tw-text-opacity: 1;
-    color: rgba(96, 96, 96, var(--tw-text-opacity));
-}
 .text-opacity-50 {
     --tw-text-opacity: 0.5;
 }

package/dist/views/components/Teaser/Byline.hbs

@@ -0,0 +1 @@
+<span class="block mt-2 text-xs text-grey-scorpion font-headingSerif">{{text}}</span>

package/dist/views/components/Teaser/Teaser-standard.hbs

@@ -11,7 +11,7 @@
         <section class="md:px-0 {{inline-switch teasersize '["sm"]' '["","px-5"]'}}">
             <div class="hidden mt-2 text-base font-copy md:block">{{shorttext}}</div>
             {{#if profiles}}
-                <div class="mt-1 text-sm text-gray-500 font-headingSerif">{{profiles}}</div>
+                {{> components/Teaser/Byline text=profiles}}
             {{/if}}
         </section>
     </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.42.2",
+    "version": "0.42.3",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",
         "storybook": "start-storybook -p 6006 public",

package/src/stories/views/components/Teaser/Byline.hbs

@@ -0,0 +1 @@
+<span class="block mt-2 text-xs text-grey-scorpion font-headingSerif">{{text}}</span>

package/src/stories/views/components/Teaser/Byline.stories.mdx

@@ -0,0 +1,35 @@
+import { ArgsTable, Meta, Story, Preview } from "@storybook/addon-docs";
+
+import byline from "./Byline.hbs";
+
+<Meta
+  title="Komponenten/Teaser/Komponenten/Byline"
+  argTypes={{
+    text: {
+      control: "text",
+      description: "Bylinetext",
+    },
+  }}
+/>
+
+export const Template = ({ text, ...args }) => {
+  // You can either use a function to create DOM elements or use a plain html string!
+  // return `<span>${topline}</span>`;
+  return byline({ text, ...args });
+};
+
+# Byline
+
+<Preview withToolbar>
+  <Story
+    name="default"
+    args={{
+      text:
+        "Dies ist die Byline",
+    }}
+  >
+    {Template.bind({})}
+  </Story>
+</Preview>
+
+<ArgsTable story="default" />

package/src/stories/views/components/Teaser/Teaser-standard.hbs

@@ -11,7 +11,7 @@
         <section class="md:px-0 {{inline-switch teasersize '["sm"]' '["","px-5"]'}}">
             <div class="hidden mt-2 text-base font-copy md:block">{{shorttext}}</div>
             {{#if profiles}}
-                <div class="mt-1 text-sm text-gray-500 font-headingSerif">{{profiles}}</div>
+                {{> components/Teaser/Byline text=profiles}}
             {{/if}}
         </section>
     </div>