hr-design-system-handlebars 0.39.2 → 0.40.0

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# v0.40.0 (Tue Apr 05 2022)
+
+#### 🚀 Enhancement
+
+- Adjusted font sizes to fit design requirements [#204](https://github.com/mumprod/hr-design-system-handlebars/pull/204) ([@vascoeduardo](https://github.com/vascoeduardo))
+
+#### Authors: 1
+
+- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
+
+---
+
 # v0.39.2 (Mon Apr 04 2022)
 
 #### 🐛 Bug Fix

package/dist/assets/index.css

@@ -2147,7 +2147,7 @@ Ensure the default browser behavior of the `hidden` attribute.
     line-height: 1.75rem;
 }
 .text-2xl {
-    font-size: 1.5rem;
+    font-size: 1.375rem;
     line-height: 2rem;
 }
 .text-3xl {
@@ -2155,12 +2155,8 @@ Ensure the default browser behavior of the `hidden` attribute.
     line-height: 2.25rem;
 }
 .text-4xl {
-    font-size: 2.25rem;
-    line-height: 2.5rem;
-}
-.text-22Px {
-    font-size: 1.375rem;
-    line-height: 1.875rem;
+    font-size: 2rem;
+    line-height: 2.25rem;
 }
 .text-5xl {
     font-size: 3rem;
@@ -2626,9 +2622,9 @@ Ensure the default browser behavior of the `hidden` attribute.
     .md\:pl-0 {
         padding-left: 0px;
     }
-    .md\:text-33Px {
-        font-size: 2.063rem;
-        line-height: 2.5rem;
+    .md\:text-4xl {
+        font-size: 2rem;
+        line-height: 2.25rem;
     }
     .md\:drop-shadow-md {
         --tw-drop-shadow: drop-shadow(0 5px 3px rgba(0, 0, 0, 0.07));

package/dist/views/components/Title.hbs

@@ -1 +1 @@
-<span class="block {{inline-switch size '["lg","md","sm"]' '["text-22Px md:text-33Px","text-22Px","text-lg"]'}} font-headingSerif mt-0.5">{{text}}</span>
+<span class="block {{inline-switch size '["lg","md","sm"]' '["text-2xl md:text-4xl","text-2xl","text-lg"]'}} font-headingSerif mt-0.5">{{text}}</span>

package/package.json

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

package/src/stories/Typography.stories.mdx

@@ -92,9 +92,9 @@ Zur Auszeichnung von Überschriften stehen die folgenden Utility Klassen zur ver
 | `font-heading`      | `font-family: RobotoCond, sans-serif`               |                    | Setzt die Eigenschaft `font-family`                   |
 | `text-lg`           | `font-size: 1.125rem` <br /> `line-height: 1.75rem` | `18px`<br />`28px` | Setzt die Eigenschaften `font-size` und `line-height` |
 | `text-xl`           | `font-size: 1.25rem` <br /> `line-height: 1.75rem`  | `20px`<br />`28px` | Setzt die Eigenschaften `font-size` und `line-height` |
-| `text-2xl`          | `font-size: 1.5rem` <br /> `line-height: 2rem`      | `24px`<br />`32px` | Setzt die Eigenschaften `font-size` und `line-height` |
+| `text-2xl`          | `font-size: 1.375rem` <br /> `line-height: 2rem`    | `22px`<br />`32px` | 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.25rem` <br /> `line-height: 2.5rem`   | `36px`<br />`40px` | Setzt die Eigenschaften `font-size` und `line-height` |
+| `text-4xl`          | `font-size: 2rem` <br /> `line-height: 2.25rem`     | `32px`<br />`36px` | Setzt die Eigenschaften `font-size` und `line-height` |
 
 ### Verwendung RobotoSlab
 

package/src/stories/views/components/Title.hbs

@@ -1 +1 @@
-<span class="block {{inline-switch size '["lg","md","sm"]' '["text-22Px md:text-33Px","text-22Px","text-lg"]'}} font-headingSerif mt-0.5">{{text}}</span>
+<span class="block {{inline-switch size '["lg","md","sm"]' '["text-2xl md:text-4xl","text-2xl","text-lg"]'}} font-headingSerif mt-0.5">{{text}}</span>

package/tailwind.config.js

@@ -35,10 +35,11 @@ module.exports = {
             wider: '.025em',
             widest: '.05em',
         },
+
         extend: {
             fontSize: {                
-                '22Px': ['1.375rem', '1.875rem'],
-                '33Px': ['2.063rem', '2.5rem'],
+                '2xl':['1.375rem', '2rem'],
+                '4xl':['2rem', '2.25rem'],
             },
             boxShadow: {
                 inner: 'inset 0 0px 5px 0 rgba(0, 0, 0, 0.25)',