hr-design-system-handlebars 0.42.4 → 0.42.7

package/CHANGELOG.md

@@ -1,3 +1,39 @@
+# v0.42.7 (Tue Apr 19 2022)
+
+#### 🐛 Bug Fix
+
+- extend byline [#216](https://github.com/mumprod/hr-design-system-handlebars/pull/216) ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+#### Authors: 1
+
+- Geraldo ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+---
+
+# v0.42.6 (Wed Apr 13 2022)
+
+#### 🐛 Bug Fix
+
+- - added aspect ratio classes with fallback to tailwind.css [#215](https://github.com/mumprod/hr-design-system-handlebars/pull/215) ([@vascoeduardo](https://github.com/vascoeduardo))
+
+#### Authors: 1
+
+- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
+
+---
+
+# v0.42.5 (Wed Apr 13 2022)
+
+#### 🐛 Bug Fix
+
+- Page story update use new teaser now [#214](https://github.com/mumprod/hr-design-system-handlebars/pull/214) ([@vascoeduardo](https://github.com/vascoeduardo))
+
+#### Authors: 1
+
+- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
+
+---
+
 # v0.42.4 (Tue Apr 12 2022)
 
 #### 🐛 Bug Fix

package/build/helpers/loca.js

@@ -10,7 +10,12 @@ module.exports = function(text, options) {
         "search_input_aria_submit": "Suche starten",
         "search_input_placeholder": "Ort oder Thema suchen",
         "feature_box_anchor": "Livestream Player anspringen",
-        "header_homepage_link_title": "Startseite hessenschau . d e"
+        "header_homepage_link_title": "Startseite hessenschau . d e",
+        "comment_anchor_1": "zu den ",
+        "comment_label_text": "Kommentar",
+        "comment_label_text_many": "Kommentare",
+        "comment_anchor_2": " Kommentaren des Artikels springen",
+        "date_simple_at": options + " Uhr"
     }
 
     for (let key in locas){

package/dist/assets/index.css

@@ -788,7 +788,7 @@ Ensure the default browser behavior of the `hidden` attribute.
 .grid-page {
         grid-template-columns:
             [full-start] minmax(1rem, 1fr)
-            [main-start] minmax(0, 64rem) [main-end]
+            [main-start] minmax(0, 63rem) [main-end]
             minmax(1rem, 1fr) [full-end];
     }
 
@@ -796,6 +796,54 @@ Ensure the default browser behavior of the `hidden` attribute.
         grid-column: full;
     }
 
+/*! ****************************/
+
+/*! Aspect Ratio with fallback */
+
+/*! ****************************/
+
+.ar-16-9 {
+        aspect-ratio: 16 / 9    
+    }
+
+@supports not (aspect-ratio: 16 / 9) {
+        .ar-16-9::before {
+            float: left;
+            padding-top: 56.25%;
+            content: '';
+        }
+
+        .ar-16-19::after {
+            display: block;
+            content: '';
+            clear: both;
+        }
+    }
+
+.ar-1-1 {
+        aspect-ratio: 1 / 1    
+    }
+
+@supports not (aspect-ratio: 1 / 1) {
+        .ar-1-1::before {
+            float: left;
+            padding-top: 100%;
+            content: '';
+        }
+
+        .ar-1-1::after {
+            display: block;
+            content: '';
+            clear: both;
+        }
+    }
+
+/*! ********************************/
+
+/*! Aspect Ratio with fallback end */
+
+/*! ********************************/
+
 .headline--barrier {
         display: -webkit-box;
         display: -ms-flexbox;
@@ -1499,6 +1547,10 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-left: 1rem;
     margin-right: 1rem;
 }
+.mx-px {
+    margin-left: 1px;
+    margin-right: 1px;
+}
 .mt-6 {
     margin-top: 1.5rem;
 }
@@ -1514,14 +1566,17 @@ Ensure the default browser behavior of the `hidden` attribute.
 .-mt-10 {
     margin-top: -2.5rem;
 }
-.mb-4 {
-    margin-bottom: 1rem;
+.mr-2\.5 {
+    margin-right: 0.625rem;
 }
-.mt-4 {
-    margin-top: 1rem;
+.mr-2 {
+    margin-right: 0.5rem;
 }
-.mt-1 {
-    margin-top: 0.25rem;
+.mr-0\.5 {
+    margin-right: 0.125rem;
+}
+.mr-0 {
+    margin-right: 0px;
 }
 .mt-0\.5 {
     margin-top: 0.125rem;
@@ -1550,6 +1605,9 @@ Ensure the default browser behavior of the `hidden` attribute.
 .inline-block {
     display: inline-block;
 }
+.inline {
+    display: inline;
+}
 .flex {
     display: -webkit-box;
     display: -ms-flexbox;
@@ -1647,6 +1705,9 @@ Ensure the default browser behavior of the `hidden` attribute.
 .w-40 {
     width: 10rem;
 }
+.w-5 {
+    width: 1.25rem;
+}
 .w-12 {
     width: 3rem;
 }
@@ -2182,6 +2243,9 @@ Ensure the default browser behavior of the `hidden` attribute.
 .font-bold {
     font-weight: 700;
 }
+.uppercase {
+    text-transform: uppercase;
+}
 .leading-3 {
     line-height: .75rem;
 }
@@ -2216,14 +2280,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     --tw-text-opacity: 1;
     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);
@@ -2231,9 +2287,8 @@ Ensure the default browser behavior of the `hidden` attribute.
 .text-opacity-50 {
     --tw-text-opacity: 0.5;
 }
-.no-underline {
-    -webkit-text-decoration-line: none;
-            text-decoration-line: none;
+.decoration-1 {
+    text-decoration-thickness: 1px;
 }
 .placeholder-blue-congress::-webkit-input-placeholder {
     --tw-placeholder-opacity: 1;
@@ -2426,9 +2481,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     transition: transform 150ms ease-in-out 0s;
     transition: transform 150ms ease-in-out 0s, -webkit-transform 150ms ease-in-out 0s;
 }
-.first\:ml-0:first-child {
-    margin-left: 0px;
-}
 .first\:border-t:first-child {
     border-top-width: 1px;
 }
@@ -2438,9 +2490,6 @@ Ensure the default browser behavior of the `hidden` attribute.
 .first\:font-bold:first-child {
     font-weight: 700;
 }
-.last\:mr-0:last-child {
-    margin-right: 0px;
-}
 .last\:border-b-0:last-child {
     border-bottom-width: 0px;
 }
@@ -2505,165 +2554,216 @@ Ensure the default browser behavior of the `hidden` attribute.
     }
 }
 @media (min-width: 768px) {
+    .md\:ar-16-9 {
+        aspect-ratio: 16 / 9    
+    }
+
+    @supports not (aspect-ratio: 16 / 9) {
+        .md\:ar-16-9::before {
+            float: left;
+            padding-top: 56.25%;
+            content: '';
+        }
+
+        .ar-16-19::after {
+            display: block;
+            content: '';
+            clear: both;
+        }
+    }
+
     .md\:static {
         position: static;
     }
+
     .md\:top-auto {
         top: auto;
     }
+
     .md\:left-auto {
         left: auto;
     }
+
     .md\:top-12 {
         top: 3rem;
     }
+
     .md\:left-0 {
         left: 0px;
     }
+
     .md\:z-101 {
         z-index: 101;
     }
+
     .md\:order-2 {
         -webkit-box-ordinal-group: 3;
             -ms-flex-order: 2;
                 order: 2;
     }
+
     .md\:order-4 {
         -webkit-box-ordinal-group: 5;
             -ms-flex-order: 4;
                 order: 4;
     }
+
     .md\:col-span-8 {
         grid-column: span 8 / span 8;
     }
+
     .md\:col-span-6 {
         grid-column: span 6 / span 6;
     }
+
     .md\:col-span-4 {
         grid-column: span 4 / span 4;
     }
+
     .md\:col-span-3 {
         grid-column: span 3 / span 3;
     }
-    .md\:mx-2 {
-        margin-left: 0.5rem;
-        margin-right: 0.5rem;
-    }
+
     .md\:mt-0 {
         margin-top: 0px;
     }
+
     .md\:-mt-40 {
         margin-top: -10rem;
     }
-    .md\:mt-8 {
-        margin-top: 2rem;
-    }
-    .md\:mb-0 {
-        margin-bottom: 0px;
-    }
+
     .md\:block {
         display: block;
     }
+
     .md\:flex {
         display: -webkit-box;
         display: -ms-flexbox;
         display: flex;
     }
+
     .md\:hidden {
         display: none;
     }
+
     .md\:h-header-md {
         height: 5.5625rem;
     }
+
     .md\:h-12 {
         height: 3rem;
     }
+
     .md\:h-7 {
         height: 1.75rem;
     }
+
     .md\:h-full {
         height: 100%;
     }
+
     .md\:h-8 {
         height: 2rem;
     }
+
     .md\:w-1\/2 {
         width: 50%;
     }
+
     .md\:w-40 {
         width: 10rem;
     }
+
     .md\:w-80 {
         width: 20rem;
     }
+
     .md\:w-auto {
         width: auto;
     }
+
     .md\:w-8 {
         width: 2rem;
     }
+
     .md\:max-w-1\/2 {
         max-width: 50%;
     }
+
     .md\:flex-auto {
         -webkit-box-flex: 1;
             -ms-flex: 1 1 auto;
                 flex: 1 1 auto;
     }
+
     .md\:flex-col {
         -webkit-box-orient: vertical;
         -webkit-box-direction: normal;
             -ms-flex-direction: column;
                 flex-direction: column;
     }
+
     .md\:justify-end {
         -webkit-box-pack: end;
             -ms-flex-pack: end;
                 justify-content: flex-end;
     }
+
     .md\:rounded-none {
         border-radius: 0px;
     }
+
     .md\:border-0 {
         border-width: 0px;
     }
+
     .md\:border-r {
         border-right-width: 1px;
     }
+
     .md\:border-l {
         border-left-width: 1px;
     }
+
     .md\:border-white {
         --tw-border-opacity: 1;
         border-color: rgba(255, 255, 255, var(--tw-border-opacity));
     }
+
     .md\:px-0 {
         padding-left: 0px;
         padding-right: 0px;
     }
+
     .md\:px-5 {
         padding-left: 1.25rem;
         padding-right: 1.25rem;
     }
+
     .md\:px-4 {
         padding-left: 1rem;
         padding-right: 1rem;
     }
+
     .md\:pt-4 {
         padding-top: 1rem;
     }
+
     .md\:pl-0 {
         padding-left: 0px;
     }
+
     .md\:text-4xl {
         font-size: 2.125rem;
         line-height: 2.25rem;
     }
+
     .md\:drop-shadow-md {
         --tw-drop-shadow: drop-shadow(0 5px 3px rgba(0, 0, 0, 0.07));
         -webkit-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);
                 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\:filter {
         -webkit-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);
                 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);

package/dist/views/components/Page/Page.hbs

@@ -28,137 +28,32 @@
                 id="content"
                 class="flex items-center justify-center"
             >
-                <div class="container px-3.5 md:px-5 lg:px-10">
-                    <div class="md:mt-8">
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="xxl"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
+                <div class="grid grid-page">
+                    <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
+                        {{> components/Teaser/Teaser-standard }}
                     </div>
-                    <div class="md:mt-8">
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="lg"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
-
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="lg"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
-                    </div>
-                    <div class="md:mt-8">
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="md"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
-
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="md"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
-
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="md"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
+                    <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
+                        {{> components/Teaser/Teaser-standard teasersize="lg"}}
+                        {{> components/Teaser/Teaser-standard teasersize="lg"}}
                     </div>
-                    <div class="md:mt-8">
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="lg"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
-
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="lg"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
+                    <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
+                        {{> components/Teaser/Teaser-standard teasersize="md"}}
+                        {{> components/Teaser/Teaser-standard teasersize="md"}}
+                        {{> components/Teaser/Teaser-standard teasersize="md"}}
                     </div>
-                    <div class="md:mt-8">
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="lg"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
-
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="lg"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
+                    <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
+                        {{> components/Teaser/Teaser-standard teasersize="lg"}}
+                        {{> components/Teaser/Teaser-standard teasersize="lg"}}
+                    </div>               
+                    <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
+                        {{> components/Teaser/Teaser-standard teasersize="sm"}}
+                        {{> components/Teaser/Teaser-standard teasersize="sm"}}
+                        {{> components/Teaser/Teaser-standard teasersize="sm"}}
+                        {{> components/Teaser/Teaser-standard teasersize="sm"}}
                     </div>
-                    <div class="md:mt-8">
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="sm"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
-
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="sm"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
-
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="sm"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
-                        {{> components/Teaser/Teaser 
-                                variant="Serif"
-                                teaserSize="sm"
-                                topline="So plant Glasner bei der Eintracht"
-                                headline="Silvas Erbe wird auf mehrere Schultern verteilt"
-                                teaserText="Nach dem Abgang von André Silva und dem Zugang von Santos Borré hat Trainer Oliver Glasner Einblicke in seine Offensivideen für Eintracht Frankfurt gegeben. Er plant mit den Flanken von Filip Kostic und spricht ein Sonderlob für einen Youngster aus."
-                                author="Stephan Reich"
-                        }}
+                    <div class="grid grid-cols-12 py-6 col-full gap-x-6 gap-y-6 sm:px-8 sm:col-main">
+                        {{> components/Teaser/Teaser-standard teasersize="lg"}}
+                        {{> components/Teaser/Teaser-standard teasersize="lg"}}
                     </div>
                     
                 </div>