hr-design-system-handlebars 1.50.9 → 1.50.10

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# v1.50.10 (Mon Nov 20 2023)
+
+#### 🐛 Bug Fix
+
+- Fixxed some px values in Typography documentation [#758](https://github.com/mumprod/hr-design-system-handlebars/pull/758) ([@vascoeduardo](https://github.com/vascoeduardo))
+
+#### Authors: 1
+
+- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
+
+---
+
 # v1.50.9 (Mon Nov 20 2023)
 
 #### 🐛 Bug Fix

package/dist/assets/index.css

@@ -533,7 +533,7 @@ video {
   padding-left: 1rem;
   padding-right: 1rem;
   font-size: 0.75rem;
-  line-height: 1.063rem;
+  line-height: 1.0625rem;
 }
 .btn--md {
   padding-left: 1.25rem;
@@ -541,7 +541,7 @@ video {
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
   font-size: 0.875rem;
-  line-height: 1.188rem;
+  line-height: 1.1875rem;
 }
 .btn--lg {
   padding-left: 1.5rem;
@@ -2645,15 +2645,15 @@ article.indexText ul {
 }
 .text-sm {
   font-size: 0.875rem;
-  line-height: 1.188rem;
+  line-height: 1.1875rem;
 }
 .text-xl {
   font-size: 1.25rem;
-  line-height: 1.675rem;
+  line-height: 1.6875rem;
 }
 .text-xs {
   font-size: 0.75rem;
-  line-height: 1.063rem;
+  line-height: 1.0625rem;
 }
 .\!font-bold {
   font-weight: 700 !important;
@@ -3055,7 +3055,7 @@ article.indexText ul {
   border-bottom-color: var(--color-secondary-ds);
 }
 .counter-reset {
-  counter-reset: cnt1700473359568;
+  counter-reset: cnt1700494081377;
 }
 .hyphens-auto {
   -webkit-hyphens: auto;
@@ -3063,15 +3063,15 @@ article.indexText ul {
 }
 .placeholder-text-xs::-webkit-input-placeholder {
   font-size: 0.75rem;
-  line-height: 1.063rem;
+  line-height: 1.0625rem;
 }
 .placeholder-text-xs::-moz-placeholder {
   font-size: 0.75rem;
-  line-height: 1.063rem;
+  line-height: 1.0625rem;
 }
 .placeholder-text-xs::placeholder {
   font-size: 0.75rem;
-  line-height: 1.063rem;
+  line-height: 1.0625rem;
 }
 /*! ****************************/
 /*! Aspect Ratio with fallback */
@@ -3316,7 +3316,7 @@ article.indexText ul {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1700473359568 1;
+  counter-increment: cnt1700494081377 1;
 }
 .-ordered::before {
   position: absolute;
@@ -3332,7 +3332,7 @@ article.indexText ul {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1700473359568);
+  content: counter(cnt1700494081377);
 }
 /*! ****************************/
 /*! DataPolicy stuff           */
@@ -5197,7 +5197,7 @@ article.indexText ul {
 
   .sm\:text-xl {
     font-size: 1.25rem;
-    line-height: 1.675rem;
+    line-height: 1.6875rem;
   }
     .sm\:ar-16-9 {
         aspect-ratio: 16 / 9;

package/package.json

@@ -6,7 +6,7 @@
     "license": "MIT",
     "main": "dist/index.js",
     "repository": "https://github.com/szuelch/hr-design-system-handlebars",
-    "version": "1.50.9",
+    "version": "1.50.10",
     "scripts": {
         "test": "echo \"Error: no test specified\" && exit 1",
         "storybook": "storybook dev -p 6006 public",
@@ -55,7 +55,7 @@
         "auto": "^10.26.0",
         "autoprefixer": "^10.4.2",
         "babel-loader": "^8.2.2",
-        "chromatic": "^5.6.2",
+        "chromatic": "^9.1.0",
         "copyfiles": "^2.4.1",
         "core-js-pure": "^3.30.1",
         "cross-env": "^7.0.3",

package/src/stories/Typography.mdx

@@ -12,14 +12,14 @@ die Schriftart **DIN**. Überschriften werden mit **Roboto** ausgezeichnet und M
 
 Zur Auszeichnung von Fließtexten stehen die folgenden Utility Klassen zur verfügung:
 
-| Klasse      | Properties                                          | Pixel Werte        | Erläuterung                                           |
-| :---------- | :-------------------------------------------------- | ------------------ | :---------------------------------------------------- |
-| `font-copy` | `font-family: DIN, sans-serif`                      |                    | Setzt die Eigenschaft `font-family`                   |
-| `text-xs`   | `font-size: 0.75rem` <br /> `line-height: 1rem`     | `12px`<br />`16px` | Setzt die Eigenschaften `font-size` und `line-height` |
-| `text-sm`   | `font-size: 0.875rem` <br /> `line-height: 1.88rem` | `14px`<br />`19px` | Setzt die Eigenschaften `font-size` und `line-height` |
-| `text-base` | `font-size: 1rem` <br /> `line-height: 1.375rem`    | `16px`<br />`22px` | Setzt die Eigenschaften `font-size` und `line-height` |
-| `text-lg`   | `font-size: 1.125rem` <br /> `line-height: 1.75rem` | `18px`<br />`24px` | Setzt die Eigenschaften `font-size` und `line-height` |
-| `text-xl`   | `font-size: 1.25rem` <br /> `line-height: 1.75rem`  | `20px`<br />`26px` | Setzt die Eigenschaften `font-size` und `line-height` |
+| Klasse      | Properties                                           | Pixel Werte        | Erläuterung                                           |
+| :---------- | :--------------------------------------------------- | ------------------ | :---------------------------------------------------- |
+| `font-copy` | `font-family: DIN, sans-serif`                       |                    | Setzt die Eigenschaft `font-family`                   |
+| `text-xs`   | `font-size: 0.75rem` <br /> `line-height: 1.0625rem` | `12px`<br />`17px` | Setzt die Eigenschaften `font-size` und `line-height` |
+| `text-sm`   | `font-size: 0.875rem` <br /> `line-height: 1.1875rem`| `14px`<br />`19px` | Setzt die Eigenschaften `font-size` und `line-height` |
+| `text-base` | `font-size: 1rem` <br /> `line-height: 1.375rem`     | `16px`<br />`22px` | Setzt die Eigenschaften `font-size` und `line-height` |
+| `text-lg`   | `font-size: 1.125rem` <br /> `line-height: 1.5rem`   | `18px`<br />`24px` | Setzt die Eigenschaften `font-size` und `line-height` |
+| `text-xl`   | `font-size: 1.25rem` <br /> `line-height: 1.6875rem` | `20px`<br />`27px` | Setzt die Eigenschaften `font-size` und `line-height` |
 
 ### Verwendung
 
@@ -90,7 +90,7 @@ Zur Auszeichnung von Überschriften stehen die folgenden Utility Klassen zur ver
 | `font-headingSerif` | `font-family: RobotoSlab, serif`                     |                    | Setzt die Eigenschaft `font-family`                   |
 | `font-heading`      | `font-family: RobotoCond, sans-serif`                |                    | Setzt die Eigenschaft `font-family`                   |
 | `text-lg`           | `font-size: 1.125rem` <br /> `line-height: 1.5rem`   | `18px`<br />`24px` | Setzt die Eigenschaften `font-size` und `line-height` |
-| `text-xl`           | `font-size: 1.25rem` <br /> `line-height: 1.675rem`  | `20px`<br />`26px` | Setzt die Eigenschaften `font-size` und `line-height` |
+| `text-xl`           | `font-size: 1.25rem` <br /> `line-height: 1.6875rem` | `20px`<br />`27px` | Setzt die Eigenschaften `font-size` und `line-height` |
 | `text-2xl`          | `font-size: 1.375rem` <br /> `line-height: 1.75rem`  | `22px`<br />`28px` | Setzt die Eigenschaften `font-size` und `line-height` |
 | `text-3xl`          | `font-size: 1.875rem` <br /> `line-height: 2.25rem`  | `30px`<br />`36px` | Setzt die Eigenschaften `font-size` und `line-height` |
 | `text-4xl`          | `font-size: 2.125rem` <br /> `line-height: 2.375rem` | `34px`<br />`38px` | Setzt die Eigenschaften `font-size` und `line-height` |

package/tailwind.config.js

@@ -53,11 +53,11 @@ module.exports = {
                 'logo-footer' : 'var(--rounded-logo-footer)',
             },
             fontSize: {
-                'xs': ['0.75rem', '1.063rem'],
-                'sm': ['0.875rem', '1.188rem'],
+                'xs': ['0.75rem', '1.0625rem'],
+                'sm': ['0.875rem', '1.1875rem'],
                 'base': ['1rem', '1.375rem'],
                 'lg': ['1.125rem', '1.5rem'],
-                'xl': ['1.25rem', '1.675rem'],
+                'xl': ['1.25rem', '1.6875rem'],
                 '2xl': ['1.375rem', '1.75rem'],
                 '4xl': ['2.125rem', '2.375rem'],
             },