hr-design-system-handlebars 1.52.14 → 1.52.16

package/CHANGELOG.md

@@ -1,3 +1,28 @@
+# v1.52.16 (Fri Jan 26 2024)
+
+#### 🐛 Bug Fix
+
+- Adjust image spacing in copytext [#819](https://github.com/mumprod/hr-design-system-handlebars/pull/819) (saad.elbaciri@hr.de [@selbaciri](https://github.com/selbaciri))
+
+#### Authors: 2
+
+- Saad El Baciri ([@selbaciri](https://github.com/selbaciri))
+- selbaciri (saad.elbaciri@hr.de)
+
+---
+
+# v1.52.15 (Fri Jan 26 2024)
+
+#### 🐛 Bug Fix
+
+- Update font size 3xl [#818](https://github.com/mumprod/hr-design-system-handlebars/pull/818) ([@vascoeduardo](https://github.com/vascoeduardo))
+
+#### Authors: 1
+
+- Vasco ([@vascoeduardo](https://github.com/vascoeduardo))
+
+---
+
 # v1.52.14 (Thu Jan 25 2024)
 
 #### 🐛 Bug Fix

package/dist/assets/index.css

@@ -2804,17 +2804,17 @@ a.link {
   line-height: 1.75rem;
 }
 .text-3xl {
+  font-size: 1.625rem;
+  line-height: 2rem;
+}
+.text-4xl {
   font-size: 1.875rem;
   line-height: 2.25rem;
 }
-.text-4xl {
+.text-5xl {
   font-size: 2.125rem;
   line-height: 2.375rem;
 }
-.text-5xl {
-  font-size: 3rem;
-  line-height: 1;
-}
 .text-base {
   font-size: 1rem;
   line-height: 1.375rem;
@@ -3261,7 +3261,7 @@ a.link {
   border-bottom-color: var(--color-secondary-ds);
 }
 .counter-reset {
-  counter-reset: cnt1706189114920;
+  counter-reset: cnt1706271481537;
 }
 .hyphens-auto {
   -webkit-hyphens: auto;
@@ -3563,7 +3563,7 @@ a.link {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1706189114920 1;
+  counter-increment: cnt1706271481537 1;
 }
 .-ordered::before {
   position: absolute;
@@ -3579,7 +3579,7 @@ a.link {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1706189114920);
+  content: counter(cnt1706271481537);
 }
 /*! ****************************/
 /*! DataPolicy stuff           */
@@ -5414,6 +5414,11 @@ a.link {
     margin-bottom: 1.25rem;
   }
 
+  .sm480\:my-7 {
+    margin-top: 1.75rem;
+    margin-bottom: 1.75rem;
+  }
+
   .sm480\:mb-7 {
     margin-bottom: 1.75rem;
   }
@@ -5422,8 +5427,8 @@ a.link {
     margin-left: 2rem;
   }
 
-  .sm480\:mr-4 {
-    margin-right: 1rem;
+  .sm480\:mr-5 {
+    margin-right: 1.25rem;
   }
 
   .sm480\:mt-4 {
@@ -5467,7 +5472,7 @@ a.link {
     line-height: 1.75rem;
   }
 
-  .sm480\:text-4xl {
+  .sm480\:text-5xl {
     font-size: 2.125rem;
     line-height: 2.375rem;
   }
@@ -6367,12 +6372,12 @@ a.link {
     line-height: 1.75rem;
   }
 
-  .md\:text-3xl {
+  .md\:text-4xl {
     font-size: 1.875rem;
     line-height: 2.25rem;
   }
 
-  .md\:text-4xl {
+  .md\:text-5xl {
     font-size: 2.125rem;
     line-height: 2.375rem;
   }

package/dist/views/components/banner/banner.storybook.hbs

@@ -1,6 +1,6 @@
 <div class="flex flex-col py-6 bg-slate-500">
     <div class="grid mb-4 grid-page">
-        <h1 class="text-3xl font-title col-full sm:col-main">Maximalausprägung mit Struktur Navigation</h1>
+        <h1 class="text-4xl font-title col-full sm:col-main">Maximalausprägung mit Struktur Navigation</h1>
     </div>
     {{#> components/banner/header/breadcrumb_wrapper _hasBannerImage=true _hasContentNav=true }}
         {{> components/navigation/breadcrumb/breadcrumb }}
@@ -34,7 +34,7 @@
 </div>
 <div class="flex flex-col py-6 bg-orange-500">
     <div class="grid mb-4 grid-page">
-        <h1 class="text-3xl font-title col-full sm:col-main">Maximalausprägung ohne Struktur Navigation</h1>
+        <h1 class="text-4xl font-title col-full sm:col-main">Maximalausprägung ohne Struktur Navigation</h1>
     </div>
     {{#> components/banner/header/breadcrumb_wrapper _hasBannerImage=true _hasContentNav=false }}
         {{> components/navigation/breadcrumb/breadcrumb }}
@@ -65,7 +65,7 @@
 </div>
 <div class="flex flex-col py-6 bg-green-800">
     <div class="grid mb-4 grid-page">
-        <h1 class="text-3xl font-title col-full sm:col-main">Maximalausprägung Mobil kein Bild</h1>
+        <h1 class="text-4xl font-title col-full sm:col-main">Maximalausprägung Mobil kein Bild</h1>
     </div>
     {{#> components/banner/header/breadcrumb_wrapper _hasBannerImage=true _hasContentNav=false}}
         {{> components/navigation/breadcrumb/breadcrumb }}
@@ -94,7 +94,7 @@
 </div>
 <div class="flex flex-col py-6 bg-orange-oregon dark:bg-black ">
     <div class="grid mb-4 grid-page">
-        <h1 class="text-3xl font-title col-full sm:col-main">Maximalausprägung kein Bild</h1>
+        <h1 class="text-4xl font-title col-full sm:col-main">Maximalausprägung kein Bild</h1>
     </div>
     {{#> components/banner/header/breadcrumb_wrapper _hasBannerImage=false _hasContentNav=false }}
         {{> components/navigation/breadcrumb/breadcrumb }}

package/dist/views/components/banner/header/headline.hbs

@@ -1,3 +1,3 @@
-<span class="block mt-2 text-3xl sm480:text-4xl font-title text-text dark:text-text-dark">
+<span class="block mt-2 text-4xl sm480:text-5xl font-title text-text dark:text-text-dark">
     {{> @partial-block }}   
 </span>

package/dist/views/components/content/copytext/components/image/figure.hbs

@@ -1,4 +1,4 @@
-<figure class="relative mt-6 -mx-4 sm480:mx-0 {{#if _cssClasses}} {{_cssClasses}}{{/if}} {{_cssClass}}">
+<figure class="relative my-6 sm480:my-7 -mx-4 sm480:mx-0 {{#if _cssClasses}} {{_cssClasses}}{{/if}} {{_cssClass}}">
     {{#if _noAr }}
         {{> components/base/image/responsive_image _type=_type _variant=_variant _addClass=_pictureAddClass _isWebview=_isWebview _noDelay=_noDelay}}
     {{else}}

package/dist/views/components/content/copytext/components/image/image.hbs

@@ -7,7 +7,7 @@
                 _isWebview=../../_isWebview}}
         {{else}}
             {{> components/content/copytext/components/image/figure 
-                _cssClass="sm480:mr-4 sm480:w-1/2 w-auto flex-col float-none sm480:float-left break-inside-avoid page-break-inside-avoid"
+                _cssClass="sm480:mr-5 sm480:w-1/2 w-auto flex-col float-none sm480:float-left break-inside-avoid page-break-inside-avoid"
                 _type="story"
                 _variant="copytext-portrait"
                 _noAr="true"
@@ -22,7 +22,7 @@
                 _isWebview=../../_isWebview}}
         {{else}}
             {{> components/content/copytext/components/image/figure 
-                _cssClass="sm480:mr-4 sm480:w-1/2 w-auto flex-col float-none sm480:float-left break-inside-avoid page-break-inside-avoid"
+                _cssClass="sm480:mr-5 sm480:w-1/2 w-auto flex-col float-none sm480:float-left break-inside-avoid page-break-inside-avoid"
                 _type="story"
                 _variant="copytext"
                 _pictureAddClass="ar-16-9"

package/dist/views/components/event/calendar/event_calendar_event_teaser.hbs

@@ -6,7 +6,7 @@
                     <div class="flex flex-col  basis-2/12 w-2/12 align-top items-center justify-center px-4 py-3  border-dotted border-r border-event-calendar-secondary">
                         {{#with this.startDate}}
                             <span class='text-base font-serif'>{{this.weekdayNameShort}}</span>
-                            <span class='text-3xl font-serif font-bold'>{{this.day}}</span>
+                            <span class='text-4xl font-serif font-bold'>{{this.day}}</span>
                             <span class='text-base font-serif'>{{this.monthNameShort}}</span>
                         {{/with}}
                     </div>

package/dist/views/components/grid/grid_group_100_item_100.hbs

@@ -1,7 +1,7 @@
 <div class="grid grid-page">
   <div class="{{> components/grid/grid_group_wrapper_classes }}">
 {{#>components/grid/grid_group _size="100"}}
-      <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100%</h2>
+      <h2 class="text-5xl headline--barrier col-span-full">Gruppen 100%</h2>
       {{#>components/grid/grid_item _size="12"}}
         <a href="#">
           <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">

package/dist/views/components/grid/grid_group_100_item_100_with_background.hbs

@@ -1,7 +1,7 @@
  <div class="grid grid-page">
   <div class="{{> components/grid/grid_group_wrapper_classes }}">
  {{#>components/grid/grid_group _backgroundColor="2" _size="100"}} 
-      <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100% mit blauen Hintergrund bis Rand</h2>
+      <h2 class="text-5xl headline--barrier col-span-full">Gruppen 100% mit blauen Hintergrund bis Rand</h2>
       {{#>components/grid/grid_item _size="6"}}
         <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           6/12 = 50%    

package/dist/views/components/grid/grid_group_100_item_25.hbs

@@ -1,25 +1,25 @@
 {{#>components/grid/grid_group teaserSize="100"}}
-        <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100%</h2>
+        <h2 class="text-5xl headline--barrier col-span-full">Gruppen 100%</h2>
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div> 
         {{/components/grid/grid_item}}
         
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div> 
         {{/components/grid/grid_item}}
 
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div>   
         {{/components/grid/grid_item}}
 
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div>    
         {{/components/grid/grid_item}} 

package/dist/views/components/grid/grid_group_100_item_50.hbs

@@ -1,5 +1,5 @@
 {{#>components/grid/grid_group teaserSize="100"}}
-      <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100%</h2>
+      <h2 class="text-5xl headline--barrier col-span-full">Gruppen 100%</h2>
       {{#>components/grid/grid_item _size="6"}}
       <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
         6/12 = 50%    

package/dist/views/components/grid/grid_group_100_tabbed_25.hbs

@@ -1,27 +1,27 @@
 <div class="grid grid-page">
   <div class="{{> components/grid/grid_group_wrapper_classes }}">
 {{#>components/grid/grid_group_tabbed }}
-        <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100% Tabbed</h2>
+        <h2 class="text-5xl headline--barrier col-span-full">Gruppen 100% Tabbed</h2>
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div> 
         {{/components/grid/grid_item}}
         
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div> 
         {{/components/grid/grid_item}}
 
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div>   
         {{/components/grid/grid_item}}
 
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div>    
         {{/components/grid/grid_item}} 

package/dist/views/components/grid/grid_group_100_tabbed_33.hbs

@@ -1,7 +1,7 @@
 <div class="grid grid-page">
   <div class="{{> components/grid/grid_group_wrapper_classes }}">
 {{#>components/grid/grid_group_tabbed}} 
-      <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100%</h2>
+      <h2 class="text-5xl headline--barrier col-span-full">Gruppen 100%</h2>
       {{#>components/grid/grid_item _size="4"}}
       <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
         4/12 = 33%    

package/dist/views/components/grid/grid_group_100_tabbed_50.hbs

@@ -1,15 +1,15 @@
 <div class="grid grid-page">
   <div class="{{> components/grid/grid_group_wrapper_classes }}">
 {{#>components/grid/grid_group_tabbed }}
-        <h2 class="text-4xl headline--barrier col-span-full">Gruppen 50% Tabbed</h2>
+        <h2 class="text-5xl headline--barrier col-span-full">Gruppen 50% Tabbed</h2>
         {{#>components/grid/grid_item _size="6"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           6/12 = 50%    
         </div> 
         {{/components/grid/grid_item}}
         
         {{#>components/grid/grid_item _size="6"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           6/12 = 50%    
         </div> 
         {{/components/grid/grid_item}}

package/dist/views/components/grid/grid_group_33_item_100.hbs

@@ -1,7 +1,7 @@
  <div class="grid grid-page">
   <div class="{{> components/grid/grid_group_wrapper_classes }}">
 {{#>components/grid/grid_group teaserSize="33"}}
-      <h2 class="text-4xl headline--barrier col-span-full">Gruppen 33%</h2>
+      <h2 class="text-5xl headline--barrier col-span-full">Gruppen 33%</h2>
       {{#>components/grid/grid_item _size="12"}}
         <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           4/12 = 33%    

package/dist/views/components/grid/grid_group_50_item_100.hbs

@@ -1,7 +1,7 @@
  <div class="grid grid-page">
   <div class="{{> components/grid/grid_group_wrapper_classes }}">
 {{#>components/grid/grid_group teaserSize="50"}}
-      <h2 class="text-4xl headline--barrier col-span-full">Gruppen 50%</h2>
+      <h2 class="text-5xl headline--barrier col-span-full">Gruppen 50%</h2>
       {{#>components/grid/grid_item _size="12"}}
         <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           6/12 = 50%    

package/dist/views/components/grid/grid_group_66_item_100.hbs

@@ -1,7 +1,7 @@
   <div class="grid grid-page">
   <div class="{{> components/grid/grid_group_wrapper_classes }}">
  {{#>components/grid/grid_group teaserSize="66"}}
-      <h2 class="text-4xl headline--barrier col-span-full">Gruppen 66%</h2>
+      <h2 class="text-5xl headline--barrier col-span-full">Gruppen 66%</h2>
       {{#>components/grid/grid_item _size="12"}}
         <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           8/12 = 66%    

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

@@ -16,13 +16,13 @@ the 4 parameters are:
             {{~inline-switch
                 _size
                 '["hero","100","25"]'
-                '["text-lg md:text-4xl","text-lg md:text-4xl","text-lg","text-lg md:text-2xl"]'
+                '["text-lg md:text-5xl","text-lg md:text-5xl","text-lg","text-lg md:text-2xl"]'
             ~}}
         {{~else~}}
             {{~inline-switch
                 _size
                 '["hero","100","25"]'
-                '["text-2xl md:text-4xl","text-2xl md:text-4xl","text-lg","text-2xl"]'
+                '["text-2xl md:text-5xl","text-2xl md:text-5xl","text-lg","text-2xl"]'
             ~}}
         {{~/if~}}
     {{~/case~}}
@@ -31,13 +31,13 @@ the 4 parameters are:
             {{~inline-switch
                 _size
                 '["hero","100","25"]'
-                '["text-lg md:text-4xl","text-lg md:text-4xl","text-lg","text-lg md:text-2xl"]'
+                '["text-lg md:text-5xl","text-lg md:text-5xl","text-lg","text-lg md:text-2xl"]'
             ~}}
         {{~else~}}
             {{~inline-switch
                 _size
                 '["hero","100","25"]'
-                '["text-2xl md:text-4xl","text-2xl md:text-4xl","text-lg","text-2xl"]'
+                '["text-2xl md:text-5xl","text-2xl md:text-5xl","text-lg","text-2xl"]'
             ~}}
         {{~/if~}}
     {{~/case~}}
@@ -46,13 +46,13 @@ the 4 parameters are:
             {{~inline-switch
                 _size
                 '["hero","100","25"]'
-                '["text-lg md:text-4xl","text-lg md:text-4xl","text-lg","text-lg md:text-2xl"]'
+                '["text-lg md:text-5xl","text-lg md:text-5xl","text-lg","text-lg md:text-2xl"]'
             ~}}
         {{~else~}}
             {{~inline-switch
                 _size
                 '["hero","100","25"]'
-                '["text-2xl md:text-4xl","text-2xl md:text-4xl","text-lg","text-2xl"]'
+                '["text-2xl md:text-5xl","text-2xl md:text-5xl","text-lg","text-2xl"]'
             ~}}
         {{~/if~}}
     {{~/case~}}
@@ -60,28 +60,28 @@ the 4 parameters are:
         {{~inline-switch
             _size
             '["hero","100","50"]'
-            '["text-2xl md:text-3xl","text-lg md:text-3xl","text-lg md:text-2xl"]'
+            '["text-2xl md:text-4xl","text-lg md:text-4xl","text-lg md:text-2xl"]'
         ~}}
     {{~/case~}}
     {{~#case 'event-alternative'~}}
         {{~inline-switch
             _size
             '["hero","100","50"]'
-            '["text-2xl md:text-3xl","text-lg md:text-3xl","text-lg md:text-2xl"]'
+            '["text-2xl md:text-4xl","text-lg md:text-4xl","text-lg md:text-2xl"]'
         ~}}
     {{~/case~}}
     {{~#case 'tabbox-alternative'~}}
         {{~inline-switch
             _size
             '["hero","100","50"]'
-            '["text-2xl md:text-3xl","text-lg md:text-3xl","text-lg md:text-2xl"]'
+            '["text-2xl md:text-4xl","text-lg md:text-4xl","text-lg md:text-2xl"]'
         ~}}
     {{~/case~}}
     {{~#case 'poster'~}}
         {{#if _isCopytext~}}
-            {{~#if this.showFullSize.isTrue~}}text-xl sm480:text-2xl md:text-4xl{{else}}text-xl sm480:text-2xl{{~/if~}}
+            {{~#if this.showFullSize.isTrue~}}text-xl sm480:text-2xl md:text-5xl{{else}}text-xl sm480:text-2xl{{~/if~}}
         {{else}}
-            {{~inline-switch _size '["50","33"]' '["text-2xl md:text-4xl","text-2xl"]'~}}
+            {{~inline-switch _size '["50","33"]' '["text-2xl md:text-5xl","text-2xl"]'~}}
         {{/if}}    
     {{~/case~}}
     {{~#case 'cluster'~}}
@@ -92,7 +92,7 @@ the 4 parameters are:
         {{/if}}
     {{~/case~}}
     {{~#case 'stage'~}}
-        {{~inline-switch _size '["100"]' '[" text-2xl md:text-4xl"," text-2xl"]'}}
+        {{~inline-switch _size '["100"]' '[" text-2xl md:text-5xl"," text-2xl"]'}}
     {{~/case~}}
     {{~#case 'calendar'~}}
        text-2xl
@@ -101,14 +101,14 @@ the 4 parameters are:
         {{~inline-switch
             _size
             '["hero","100","25"]'
-            '["text-2xl md:text-4xl","text-2xl md:text-4xl","text-2xl md:text-lg","text-2xl"]'
+            '["text-2xl md:text-5xl","text-2xl md:text-5xl","text-2xl md:text-lg","text-2xl"]'
         ~}}
     {{~/case~}}
     {{~#case 'ticker-alternative'~}}
         {{~inline-switch
             _size
             '["hero","100","50"]'
-            '["text-2xl md:text-4xl","text-2xl md:text-2xl","text-lg md:text-2xl"]'
+            '["text-2xl md:text-5xl","text-2xl md:text-2xl","text-lg md:text-2xl"]'
         ~}}
     {{~/case~}}
 {{~/switch~}}

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

@@ -1,7 +1,7 @@
 {{#if this.hasGroupItems}}
     {{#>components/grid/grid_group _backgroundColor=this.backgroundColor }} 
             {{~#if this.hasGroupTitle}}
-                <{{if this.headlineTag this.headlineTag "h2"}} class="text-2xl {{#unless this.isRelatedContent}} md:text-4xl{{else}} justifyLine{{/unless}} col-span-full py-0 font-title {{#if this.backgroundColor}} text-center{{else}} headline-barrier{{/if}}">
+                <{{if this.headlineTag this.headlineTag "h2"}} class="text-2xl {{#unless this.isRelatedContent}} md:text-5xl{{else}} justifyLine{{/unless}} col-span-full py-0 font-title {{#if this.backgroundColor}} text-center{{else}} headline-barrier{{/if}}">
                     {{~#if this.hasLink}}<a class="no-underline hover:underline decoration-1 md:decoration-2 text-link" href="{{this.link.url}}">{{/if~}}
                         {{this.groupTitle}}
                     {{~#if this.hasLink}}</a>{{/if~}}

package/dist/views/components/teaser/group_teaser/group_teaser_accented.hbs

@@ -2,7 +2,7 @@
     {{#>components/grid/grid_group size=this.teaserSize }}
         <div class="grid items-start content-start h-auto grid-cols-12 col-span-12 py-5 mx-5 group-accented sm:p-5 sm:mx-0 rounded-tl-hr rounded-br-hr bg-highlight-1 gap-x-6 gap-y-5">
             {{~#if this.hasGroupTitle}}
-                <h2 class="text-2xl md:text-4xl px-5 sm:px-0 col-span-full pt-0 pb-4 font-title {{#if this.backgroundColor}} text-center{{else}} headline-barrier{{/if}}">
+                <h2 class="text-2xl md:text-5xl px-5 sm:px-0 col-span-full pt-0 pb-4 font-title {{#if this.backgroundColor}} text-center{{else}} headline-barrier{{/if}}">
                     {{~#if this.hasLink}}<a class="no-underline hover:underline decoration-1 md:decoration-2 text-blue-science" href="{{this.link.url}}">{{/if~}}
                     {{this.groupTitle}}
                     {{~#if this.hasLink}}</a>{{/if~}}

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

@@ -10,7 +10,7 @@
 >
     {{#if this.title}}
         <h3
-            class='text-2xl md:text-4xl font-title
+            class='text-2xl md:text-5xl font-title
                 {{~inline-switch this.teaserType '["highlighted"]' '[" text-white",""]'}}'
         >
             {{this.title}}

package/dist/views_static/components/banner/banner.storybook.hbs

@@ -1,6 +1,6 @@
 <div class="flex flex-col py-6 bg-slate-500">
     <div class="grid mb-4 grid-page">
-        <h1 class="text-3xl font-title col-full sm:col-main">Maximalausprägung mit Struktur Navigation</h1>
+        <h1 class="text-4xl font-title col-full sm:col-main">Maximalausprägung mit Struktur Navigation</h1>
     </div>
     {{#> components/banner/header/breadcrumb_wrapper _hasBannerImage=true _hasContentNav=true }}
         {{> components/navigation/breadcrumb/breadcrumb }}
@@ -34,7 +34,7 @@
 </div>
 <div class="flex flex-col py-6 bg-orange-500">
     <div class="grid mb-4 grid-page">
-        <h1 class="text-3xl font-title col-full sm:col-main">Maximalausprägung ohne Struktur Navigation</h1>
+        <h1 class="text-4xl font-title col-full sm:col-main">Maximalausprägung ohne Struktur Navigation</h1>
     </div>
     {{#> components/banner/header/breadcrumb_wrapper _hasBannerImage=true _hasContentNav=false }}
         {{> components/navigation/breadcrumb/breadcrumb }}
@@ -65,7 +65,7 @@
 </div>
 <div class="flex flex-col py-6 bg-green-800">
     <div class="grid mb-4 grid-page">
-        <h1 class="text-3xl font-title col-full sm:col-main">Maximalausprägung Mobil kein Bild</h1>
+        <h1 class="text-4xl font-title col-full sm:col-main">Maximalausprägung Mobil kein Bild</h1>
     </div>
     {{#> components/banner/header/breadcrumb_wrapper _hasBannerImage=true _hasContentNav=false}}
         {{> components/navigation/breadcrumb/breadcrumb }}
@@ -94,7 +94,7 @@
 </div>
 <div class="flex flex-col py-6 bg-orange-oregon dark:bg-black ">
     <div class="grid mb-4 grid-page">
-        <h1 class="text-3xl font-title col-full sm:col-main">Maximalausprägung kein Bild</h1>
+        <h1 class="text-4xl font-title col-full sm:col-main">Maximalausprägung kein Bild</h1>
     </div>
     {{#> components/banner/header/breadcrumb_wrapper _hasBannerImage=false _hasContentNav=false }}
         {{> components/navigation/breadcrumb/breadcrumb }}

package/dist/views_static/components/banner/header/headline.hbs

@@ -1,3 +1,3 @@
-<span class="block mt-2 text-3xl sm480:text-4xl font-title text-text dark:text-text-dark">
+<span class="block mt-2 text-4xl sm480:text-5xl font-title text-text dark:text-text-dark">
     {{> @partial-block }}   
 </span>

package/dist/views_static/components/content/copytext/components/image/figure.hbs

@@ -1,4 +1,4 @@
-<figure class="relative mt-6 -mx-4 sm480:mx-0 {{#if _cssClasses}} {{_cssClasses}}{{/if}} {{_cssClass}}">
+<figure class="relative my-6 sm480:my-7 -mx-4 sm480:mx-0 {{#if _cssClasses}} {{_cssClasses}}{{/if}} {{_cssClass}}">
     {{#if _noAr }}
         {{> components/base/image/responsive_image _type=_type _variant=_variant _addClass=_pictureAddClass _isWebview=_isWebview _noDelay=_noDelay}}
     {{else}}

package/dist/views_static/components/content/copytext/components/image/image.hbs

@@ -7,7 +7,7 @@
                 _isWebview=../../_isWebview}}
         {{else}}
             {{> components/content/copytext/components/image/figure 
-                _cssClass="sm480:mr-4 sm480:w-1/2 w-auto flex-col float-none sm480:float-left break-inside-avoid page-break-inside-avoid"
+                _cssClass="sm480:mr-5 sm480:w-1/2 w-auto flex-col float-none sm480:float-left break-inside-avoid page-break-inside-avoid"
                 _type="story"
                 _variant="copytext-portrait"
                 _noAr="true"
@@ -22,7 +22,7 @@
                 _isWebview=../../_isWebview}}
         {{else}}
             {{> components/content/copytext/components/image/figure 
-                _cssClass="sm480:mr-4 sm480:w-1/2 w-auto flex-col float-none sm480:float-left break-inside-avoid page-break-inside-avoid"
+                _cssClass="sm480:mr-5 sm480:w-1/2 w-auto flex-col float-none sm480:float-left break-inside-avoid page-break-inside-avoid"
                 _type="story"
                 _variant="copytext"
                 _pictureAddClass="ar-16-9"

package/dist/views_static/components/event/calendar/event_calendar_event_teaser.hbs

@@ -6,7 +6,7 @@
                     <div class="flex flex-col  basis-2/12 w-2/12 align-top items-center justify-center px-4 py-3  border-dotted border-r border-event-calendar-secondary">
                         {{#with this.startDate}}
                             <span class='text-base font-serif'>{{this.weekdayNameShort}}</span>
-                            <span class='text-3xl font-serif font-bold'>{{this.day}}</span>
+                            <span class='text-4xl font-serif font-bold'>{{this.day}}</span>
                             <span class='text-base font-serif'>{{this.monthNameShort}}</span>
                         {{/with}}
                     </div>

package/dist/views_static/components/grid/grid_group_100_item_100.hbs

@@ -1,7 +1,7 @@
 <div class="grid grid-page">
   <div class="{{> components/grid/grid_group_wrapper_classes }}">
 {{#>components/grid/grid_group _size="100"}}
-      <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100%</h2>
+      <h2 class="text-5xl headline--barrier col-span-full">Gruppen 100%</h2>
       {{#>components/grid/grid_item _size="12"}}
         <a href="#">
           <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">

package/dist/views_static/components/grid/grid_group_100_item_100_with_background.hbs

@@ -1,7 +1,7 @@
  <div class="grid grid-page">
   <div class="{{> components/grid/grid_group_wrapper_classes }}">
  {{#>components/grid/grid_group _backgroundColor="2" _size="100"}} 
-      <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100% mit blauen Hintergrund bis Rand</h2>
+      <h2 class="text-5xl headline--barrier col-span-full">Gruppen 100% mit blauen Hintergrund bis Rand</h2>
       {{#>components/grid/grid_item _size="6"}}
         <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           6/12 = 50%    

package/dist/views_static/components/grid/grid_group_100_item_25.hbs

@@ -1,25 +1,25 @@
 {{#>components/grid/grid_group teaserSize="100"}}
-        <h2 class="text-4xl headline--barrier col-span-full">Gruppen 100%</h2>
+        <h2 class="text-5xl headline--barrier col-span-full">Gruppen 100%</h2>
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div> 
         {{/components/grid/grid_item}}
         
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div> 
         {{/components/grid/grid_item}}
 
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div>   
         {{/components/grid/grid_item}}
 
         {{#>components/grid/grid_item _size="3"}}
-        <div class="flex items-center justify-center text-4xl text-white bg-gray-500 aspect-video">
+        <div class="flex items-center justify-center text-5xl text-white bg-gray-500 aspect-video">
           3/12 = 25%    
         </div>    
         {{/components/grid/grid_item}}