hr-design-system-handlebars 1.90.3 → 1.91.0

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# v1.91.0 (Fri Aug 09 2024)
+
+#### 🚀 Enhancement
+
+- Bug/dpe 3260 [#1046](https://github.com/mumprod/hr-design-system-handlebars/pull/1046) ([@szuelch](https://github.com/szuelch))
+
+#### Authors: 1
+
+- [@szuelch](https://github.com/szuelch)
+
+---
+
 # v1.90.3 (Fri Aug 09 2024)
 
 #### 🐛 Bug Fix

package/dist/assets/index.css

@@ -439,7 +439,7 @@ video {
   --tw-gradient-to-position:  ;
 }
 
-.ds-focus, .ds-focus:not(:focus-visible), .ds-button, .ds-button:not(:focus-visible), .ds-button-round, .ds-button-round:not(:focus-visible), .ds-link, .ds-link:not(:focus-visible), .ds-teaser-focus, .ds-teaser-focus::before, .ds-cta > *, .ds-teaser-focus:not(:focus-visible)::before, .-isOpen, .link, .link:not(:focus-visible), .shadow, .shadow-md, .shadow-xl, .toggleSwitch-label, .before\:shadow-stage::before {
+.ds-focus, .ds-focus:not(:focus-visible), .ds-button, .ds-button:not(:focus-visible), .ds-button-round, .ds-button-round:not(:focus-visible), .ds-link, .ds-link:not(:focus-visible), .ds-teaser-focus, .ds-teaser-focus::before, .ds-cta > *, .ds-teaser-focus:not(:focus-visible)::before, .-isOpen, .copytext-ds__link, .copytext-ds__link:not(:focus-visible), .shadow, .shadow-md, .shadow-xl, .toggleSwitch-label, .before\:shadow-stage::before {
   --tw-ring-offset-shadow: 0 0 rgba(0,0,0,0);
   --tw-ring-shadow: 0 0 rgba(0,0,0,0);
   --tw-shadow: 0 0 rgba(0,0,0,0);
@@ -987,7 +987,7 @@ article.indexTextDS .indexTextHighlighted .link {
   text-decoration-thickness: 1px;
 }
 /* -----------------------------COPYTEXT ---------------------------- */
-.copytextParagraphDS .link:focus {
+.copytext-ds__link:focus {
   --tw-shadow: 0 0 0 0.25rem;
   --tw-shadow-colored: 0 0 0 0.25rem var(--tw-shadow-color);
   box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
@@ -997,32 +997,46 @@ article.indexTextDS .indexTextHighlighted .link {
   outline: 2px solid transparent;
   outline-offset: 2px;
 }
-.copytextParagraphDS .link:focus:not(:focus-visible) {
+.copytext-ds__link:focus:not(:focus-visible) {
   --tw-shadow: 0 0 rgba(0,0,0,0);
   --tw-shadow-colored: 0 0 rgba(0,0,0,0);
   box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
 }
-.copytextParagraphDS .link.ds-teaser-focus:focus {
+.copytext-ds__link.ds-teaser-focus:focus {
   --tw-shadow: 0 0 rgba(0,0,0,0);
   --tw-shadow-colored: 0 0 rgba(0,0,0,0);
   box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), var(--tw-shadow);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
 }
-.copytextParagraphDS .link {
+.copytext-ds__link {
   color: #006eb7;
   color: var(--color-link);
   -webkit-text-decoration-line: underline;
           text-decoration-line: underline;
   text-decoration-thickness: 1px;
 }
-.copytextParagraphDS .link:hover {
+.copytext-ds__link:hover {
   text-decoration-thickness: 1px;
 }
-[class~='tw-dark'] .copytextParagraphDS .link {
+[class~='tw-dark'] .copytext-ds__link {
   color: #006eb7;
   color: var(--color-link-dark);
 }
+.copytext-ds__icon {
+  margin-top: -0.125rem;
+  margin-left: 0.25rem;
+  display: inline;
+  fill: currentColor;
+}
+.copytext-ds__box .copytext-ds__icon {
+  height: 1.25rem;
+  width: 1.25rem;
+}
+.copytext-ds__paragraph .copytext-ds__icon {
+  height: 1.5rem;
+  width: 1.5rem;
+}
 .sr-only {
   position: absolute;
   width: 1px;
@@ -3324,7 +3338,7 @@ article.indexTextDS .indexTextHighlighted .link {
   border-bottom-color: var(--color-secondary-ds);
 }
 .counter-reset {
-  counter-reset: cnt1723199852550;
+  counter-reset: cnt1723214517291;
 }
 .hyphens-auto {
   -webkit-hyphens: auto;
@@ -3732,7 +3746,7 @@ article.indexTextDS .indexTextHighlighted .link {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1723199852550 1;
+  counter-increment: cnt1723214517291 1;
 }
 .-ordered::before {
   position: absolute;
@@ -3748,7 +3762,7 @@ article.indexTextDS .indexTextHighlighted .link {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1723199852550);
+  content: counter(cnt1723214517291);
 }
 /*! ****************************/
 /*! DataPolicy stuff           */

package/dist/views/components/content/copytext/components/common/paragraphbox_wrapper.hbs

@@ -1,3 +1,3 @@
-<div class="mx-1 sm:ml-[1.531rem] sm:mr-6.5 px-4 sm:pl-[1.531rem] sm:pr-6.5 border-l-[3px] border-gray-boulder overflow-auto {{#if _showFullsize}}[&+h2]:mt-4 [&+.hr-copytext-teaser-half]:mt-4 clear-both mt-12 mb-8 sm:[&+.hr-copytext-teaser-half]:mt-0 sm:mt-14 sm:mb-14 {{else}}hr-copytext-teaser-half mb-8 sm:mb-5 sm:mt-6 mt-12 w-full sm:w-1/2 sm:float-left{{/if}}">
+<div class="mx-1 sm:ml-[1.531rem] sm:mr-6.5 px-4 sm:pl-[1.531rem] sm:pr-6.5 border-l-[3px] border-gray-boulder overflow-auto {{#if _showFullsize}}[&+h2]:mt-4 [&+.hr-copytext-teaser-half]:mt-4 clear-both mt-12 mb-8 sm:[&+.hr-copytext-teaser-half]:mt-0 sm:mt-14 sm:mb-14 {{else}}hr-copytext-teaser-half mb-8 sm:mb-5 sm:mt-6 mt-12 w-full sm:w-1/2 sm:float-left{{/if}}{{#if _cssClasses}} {{_cssClasses}}{{/if}}">
     {{~> @partial-block ~}}
 </div>

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

@@ -1,4 +1,4 @@
-{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.showFullSize.isTrue}}
+{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.showFullSize.isTrue _cssClass="copytext-ds__box"}}
 
     {{~> components/base/a11y/hiddenText _locaTag="story_infobox_intro_sr" ~}}
 
@@ -33,13 +33,13 @@
         {{#each this.paragraph}}
             {{#each this.text.split}}
                 {{#if this.isText}}
-                    <p class="copytextParagraphDS {{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
+                    <p class="{{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
                 {{/if}}
                 {{#if this.isUl}}
-                    <ul class="copytextParagraphDS {{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
+                    <ul class="{{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
                 {{/if}}
                 {{#if this.isOl}}
-                    <ol class="copytextParagraphDS {{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
+                    <ol class="{{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
                 {{/if}}
             {{/each}}
         {{/each}}

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

@@ -1,4 +1,4 @@
-{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.paragraphProperties.[0].showFullSize}}
+{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.paragraphProperties.[0].showFullSize _cssClasses="copytext-ds__box"}}
     
     <span class="sr-only">{{loca "story_infobox_intro_sr" }}</span>
 
@@ -31,13 +31,13 @@
 
     {{#each this.text.split}}
         {{#if this.isText}}
-            <p class="copytextParagraphDS {{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
+            <p class="{{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
         {{/if}}
         {{#if this.isUl}}
-            <ul class="copytextParagraphDS {{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
+            <ul class="{{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
         {{/if}}
         {{#if this.isOl}}
-            <ol class="copytextParagraphDS {{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
+            <ol class="{{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
         {{/if}}
     {{/each}}
     {{~#block "subParagraphs"}}{{/block~}}

package/dist/views/components/content/copytext/components/paragraph/paragraph_body.hbs

@@ -1,9 +1,9 @@
 {{#if this.isText}}
-    <p class="mt-4 sm:mt-5 text-lg leading-normal copytextParagraphDS sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</p>
+    <p class="copytext-ds__paragraph mt-4 sm:mt-5 text-lg leading-normal sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</p>
 {{/if}}
 {{#if this.isUl}}
-    <ul class="pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-disc copytextParagraphDS sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ul>
+    <ul class="copytext-ds__paragraph pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-disc sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ul>
 {{/if}}
 {{#if this.isOl}}
-    <ol class="pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-decimal copytextParagraphDS sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ol>
+    <ol class="copytext-ds__paragraph pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-decimal sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ol>
 {{/if}}

package/dist/views_static/components/content/copytext/components/common/paragraphbox_wrapper.hbs

@@ -1,3 +1,3 @@
-<div class="mx-1 sm:ml-[1.531rem] sm:mr-6.5 px-4 sm:pl-[1.531rem] sm:pr-6.5 border-l-[3px] border-gray-boulder overflow-auto {{#if _showFullsize}}[&+h2]:mt-4 [&+.hr-copytext-teaser-half]:mt-4 clear-both mt-12 mb-8 sm:[&+.hr-copytext-teaser-half]:mt-0 sm:mt-14 sm:mb-14 {{else}}hr-copytext-teaser-half mb-8 sm:mb-5 sm:mt-6 mt-12 w-full sm:w-1/2 sm:float-left{{/if}}">
+<div class="mx-1 sm:ml-[1.531rem] sm:mr-6.5 px-4 sm:pl-[1.531rem] sm:pr-6.5 border-l-[3px] border-gray-boulder overflow-auto {{#if _showFullsize}}[&+h2]:mt-4 [&+.hr-copytext-teaser-half]:mt-4 clear-both mt-12 mb-8 sm:[&+.hr-copytext-teaser-half]:mt-0 sm:mt-14 sm:mb-14 {{else}}hr-copytext-teaser-half mb-8 sm:mb-5 sm:mt-6 mt-12 w-full sm:w-1/2 sm:float-left{{/if}}{{#if _cssClasses}} {{_cssClasses}}{{/if}}">
     {{~> @partial-block ~}}
 </div>

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

@@ -1,4 +1,4 @@
-{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.showFullSize.isTrue}}
+{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.showFullSize.isTrue _cssClass="copytext-ds__box"}}
 
     {{~> components/base/a11y/hiddenText _locaTag="story_infobox_intro_sr" ~}}
 
@@ -33,13 +33,13 @@
         {{#each this.paragraph}}
             {{#each this.text.split}}
                 {{#if this.isText}}
-                    <p class="copytextParagraphDS {{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
+                    <p class="{{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
                 {{/if}}
                 {{#if this.isUl}}
-                    <ul class="copytextParagraphDS {{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
+                    <ul class="{{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
                 {{/if}}
                 {{#if this.isOl}}
-                    <ol class="copytextParagraphDS {{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
+                    <ol class="{{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
                 {{/if}}
             {{/each}}
         {{/each}}

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

@@ -1,4 +1,4 @@
-{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.paragraphProperties.[0].showFullSize}}
+{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.paragraphProperties.[0].showFullSize _cssClasses="copytext-ds__box"}}
     
     <span class="sr-only">{{loca "story_infobox_intro_sr" }}</span>
 
@@ -31,13 +31,13 @@
 
     {{#each this.text.split}}
         {{#if this.isText}}
-            <p class="copytextParagraphDS {{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
+            <p class="{{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
         {{/if}}
         {{#if this.isUl}}
-            <ul class="copytextParagraphDS {{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
+            <ul class="{{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
         {{/if}}
         {{#if this.isOl}}
-            <ol class="copytextParagraphDS {{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
+            <ol class="{{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
         {{/if}}
     {{/each}}
     {{~#block "subParagraphs"}}{{/block~}}

package/dist/views_static/components/content/copytext/components/paragraph/paragraph_body.hbs

@@ -1,9 +1,9 @@
 {{#if this.isText}}
-    <p class="mt-4 sm:mt-5 text-lg leading-normal copytextParagraphDS sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</p>
+    <p class="copytext-ds__paragraph mt-4 sm:mt-5 text-lg leading-normal sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</p>
 {{/if}}
 {{#if this.isUl}}
-    <ul class="pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-disc copytextParagraphDS sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ul>
+    <ul class="copytext-ds__paragraph pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-disc sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ul>
 {{/if}}
 {{#if this.isOl}}
-    <ol class="pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-decimal copytextParagraphDS sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ol>
+    <ol class="copytext-ds__paragraph pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-decimal sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ol>
 {{/if}}

package/package.json

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

package/src/assets/css/custom-components.css

@@ -310,6 +310,24 @@ article.indexTextDS .indexTextHighlighted .link {
 }
 
 /* -----------------------------COPYTEXT ---------------------------- */
-.copytextParagraphDS .link {
-    @apply underline text-link decoration-1 hover:decoration-1 dark:text-link-dark ds-link;
-}
+.copytext-ds {
+    &__link {
+        @apply underline text-link decoration-1 hover:decoration-1 dark:text-link-dark ds-link;
+    }
+
+    &__icon {
+        @apply inline -mt-0.5 fill-current ml-1;
+    }
+
+    &__box {
+        .copytext-ds__icon {
+            @apply w-5 h-5;
+        }
+    }
+
+    &__paragraph {
+        .copytext-ds__icon {
+            @apply w-6 h-6;
+        }
+    }
+}

package/src/assets/fixtures/content/copytext/copytext_paragraph.inc.json

@@ -4,8 +4,8 @@
         "split": [
             {
                 "isText": true,
-                "text": "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."
+                "text": "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='copytext-ds__link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."
             }
-        ]   
+        ]
     }
-}
+}

package/src/stories/views/components/content/copytext/components/common/paragraphbox_wrapper.hbs

@@ -1,3 +1,3 @@
-<div class="mx-1 sm:ml-[1.531rem] sm:mr-6.5 px-4 sm:pl-[1.531rem] sm:pr-6.5 border-l-[3px] border-gray-boulder overflow-auto {{#if _showFullsize}}[&+h2]:mt-4 [&+.hr-copytext-teaser-half]:mt-4 clear-both mt-12 mb-8 sm:[&+.hr-copytext-teaser-half]:mt-0 sm:mt-14 sm:mb-14 {{else}}hr-copytext-teaser-half mb-8 sm:mb-5 sm:mt-6 mt-12 w-full sm:w-1/2 sm:float-left{{/if}}">
+<div class="mx-1 sm:ml-[1.531rem] sm:mr-6.5 px-4 sm:pl-[1.531rem] sm:pr-6.5 border-l-[3px] border-gray-boulder overflow-auto {{#if _showFullsize}}[&+h2]:mt-4 [&+.hr-copytext-teaser-half]:mt-4 clear-both mt-12 mb-8 sm:[&+.hr-copytext-teaser-half]:mt-0 sm:mt-14 sm:mb-14 {{else}}hr-copytext-teaser-half mb-8 sm:mb-5 sm:mt-6 mt-12 w-full sm:w-1/2 sm:float-left{{/if}}{{#if _cssClasses}} {{_cssClasses}}{{/if}}">
     {{~> @partial-block ~}}
 </div>

package/src/stories/views/components/content/copytext/components/contentbox/contentbox.hbs

@@ -1,4 +1,4 @@
-{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.showFullSize.isTrue}}
+{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.showFullSize.isTrue _cssClass="copytext-ds__box"}}
 
     {{~> components/base/a11y/hiddenText _locaTag="story_infobox_intro_sr" ~}}
 
@@ -33,13 +33,13 @@
         {{#each this.paragraph}}
             {{#each this.text.split}}
                 {{#if this.isText}}
-                    <p class="copytextParagraphDS {{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
+                    <p class="{{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
                 {{/if}}
                 {{#if this.isUl}}
-                    <ul class="copytextParagraphDS {{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
+                    <ul class="{{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
                 {{/if}}
                 {{#if this.isOl}}
-                    <ol class="copytextParagraphDS {{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
+                    <ol class="{{#if ../../../this.title}} mt-4{{else}}{{#if ../../../this.copytextParagraph.[0].paragraphBoxItem}} mt-4{{else}}{{#if @../first}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
                 {{/if}}
             {{/each}}
         {{/each}}

package/src/stories/views/components/content/copytext/components/contentbox/fixtures/contentbox.json

@@ -1 +1 @@
-{"copytext":{"title":"Contentbox: Volle Breite, mit Bild über halbe Breite und Ü","showFullSize":{"isTrue":true},"copytextParagraph":[{"paragraphBoxItem":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/buchmesse-fahnen-102_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/buchmesse-fahnen-102_v-16to9__small.jpg 320w, images/buchmesse-fahnen-102_v-16to9__medium.jpg 480w, images/buchmesse-fahnen-102_v-16to9__medium__extended.jpg 640w, images/buchmesse-fahnen-102_v-16to9.jpg 960w, images/buchmesse-fahnen-102_v-16to9__retina.jpg 1920w"}]}}}],"copytext":{"paragraph":[{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}}]}}}
+{"copytext":{"title":"Contentbox: Volle Breite, mit Bild über halbe Breite und Ü","showFullSize":{"isTrue":true},"copytextParagraph":[{"paragraphBoxItem":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/buchmesse-fahnen-102_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/buchmesse-fahnen-102_v-16to9__small.jpg 320w, images/buchmesse-fahnen-102_v-16to9__medium.jpg 480w, images/buchmesse-fahnen-102_v-16to9__medium__extended.jpg 640w, images/buchmesse-fahnen-102_v-16to9.jpg 960w, images/buchmesse-fahnen-102_v-16to9__retina.jpg 1920w"}]}}}],"copytext":{"paragraph":[{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='copytext-ds__link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}}]}}}

package/src/stories/views/components/content/copytext/components/infobox.hbs

@@ -1,4 +1,4 @@
-{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.paragraphProperties.[0].showFullSize}}
+{{#>components/content/copytext/components/common/paragraphbox_wrapper _showFullsize=this.paragraphProperties.[0].showFullSize _cssClasses="copytext-ds__box"}}
     
     <span class="sr-only">{{loca "story_infobox_intro_sr" }}</span>
 
@@ -31,13 +31,13 @@
 
     {{#each this.text.split}}
         {{#if this.isText}}
-            <p class="copytextParagraphDS {{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
+            <p class="{{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}} text-base sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</p>
         {{/if}}
         {{#if this.isUl}}
-            <ul class="copytextParagraphDS {{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
+            <ul class="{{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-disc sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ul>
         {{/if}}
         {{#if this.isOl}}
-            <ol class="copytextParagraphDS {{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
+            <ol class="{{#if ../this.paragraphProperties.[0].title}} mt-4{{else}}{{#if ../this.paragraphBoxItem}} mt-4{{else}}{{#if @first}} -mt-0.5{{else}} mt-4{{/if}}{{/if}}{{/if}}  overflow-hidden pl-5 text-base list-decimal sm480:text-lg sm480:leading-normal dark:text-text-dark">{{{this.text}}}</ol>
         {{/if}}
     {{/each}}
     {{~#block "subParagraphs"}}{{/block~}}

package/src/stories/views/components/content/copytext/components/paragraph/paragraph_body.hbs

@@ -1,9 +1,9 @@
 {{#if this.isText}}
-    <p class="mt-4 sm:mt-5 text-lg leading-normal copytextParagraphDS sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</p>
+    <p class="copytext-ds__paragraph mt-4 sm:mt-5 text-lg leading-normal sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</p>
 {{/if}}
 {{#if this.isUl}}
-    <ul class="pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-disc copytextParagraphDS sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ul>
+    <ul class="copytext-ds__paragraph pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-disc sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ul>
 {{/if}}
 {{#if this.isOl}}
-    <ol class="pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-decimal copytextParagraphDS sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ol>
+    <ol class="copytext-ds__paragraph pl-9 mt-4 sm:mt-5 overflow-hidden text-lg leading-normal list-decimal sm480:text-xl lg:leading-7.5 dark:text-text-dark">{{{this.text}}}</ol>
 {{/if}}

package/src/stories/views/components/content/copytext/fixtures/copytext.json

@@ -1 +1 @@
-{"copytextParagraph":[{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"isParagraph":true,"text":{"split":[{"isUl":true,"text":"<li>Lorem ipsum dolor sit amet</li><li>At vero eos et accusam et justo</li><li>Stet clita kasd gubergren</li>"},{"isOl":true,"text":"<li>Lorem ipsum dolor sit amet</li><li>At vero eos et accusam et justo</li><li>Stet clita kasd gubergren</li>"}]}},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"isHeadline":true,"text":"Zwischenüberschrift"},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}}]}
+{"copytextParagraph":[{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='copytext-ds__link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"isParagraph":true,"text":{"split":[{"isUl":true,"text":"<li>Lorem ipsum dolor sit amet</li><li>At vero eos et accusam et justo</li><li>Stet clita kasd gubergren</li>"},{"isOl":true,"text":"<li>Lorem ipsum dolor sit amet</li><li>At vero eos et accusam et justo</li><li>Stet clita kasd gubergren</li>"}]}},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='copytext-ds__link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"isHeadline":true,"text":"Zwischenüberschrift"},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='copytext-ds__link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}}]}

package/src/stories/views/components/content/copytext/fixtures/copytext_additionalInfo.json

@@ -1 +1 @@
-{"copytextParagraph":[{"isHeadline":true,"text":"Copytext mit Zusatzinfo"},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"isAdditionalInfo":true,"text":{"split":[{"isText":true,"text":"Sendung: hr-fernsehen, hessenschau, 13.12.2022, 19.30 Uhr"},{"isOl":true,"text":"<li>eins</li><li>zwei</li><li>drei</li>"},{"isUl":true,"text":"<li>eins</li><li>zwei</li><li>drei</li>"},{"isText":true,"text":"Quelle: hessenschau.de/Jörn Perske"}]}}]}
+{"copytextParagraph":[{"isHeadline":true,"text":"Copytext mit Zusatzinfo"},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='copytext-ds__link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='copytext-ds__link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"isAdditionalInfo":true,"text":{"split":[{"isText":true,"text":"Sendung: hr-fernsehen, hessenschau, 13.12.2022, 19.30 Uhr"},{"isOl":true,"text":"<li>eins</li><li>zwei</li><li>drei</li>"},{"isUl":true,"text":"<li>eins</li><li>zwei</li><li>drei</li>"},{"isText":true,"text":"Quelle: hessenschau.de/Jörn Perske"}]}}]}

package/src/stories/views/components/content/copytext/fixtures/copytext_audio.json

@@ -1 +1 @@
-{"copytextParagraph":[{"isHeadline":true,"text":"Copytext mit Audio"},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"paragraphBoxItem":{"isAudio":true,"isAudioOnDemand":true,"showFullSize":{"isTrue":true},"label":{"type":"audio","loca":"label_audio","byline":{"bylineText":"00:39 Min."}},"copyright":"hr","audioAuthor":"Michael Pörtner","showAirdate":true,"airdateDate":{"htmlDateTime":"2024-06-21T14:30+0200","htmlDate":"21.06.2024","date":"21.06.24","dateSeparatorTime":"21.06.24, 14:30"},"toModel":{"audioElement":{"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"__xsmall"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/hs/2024_06/240621093838_hsr_strongman_Poertner_Ost.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":39,"images":[{"kind":"preview","url":"images/strongman-100_v-1to1{size}.jpg"}],"title":"Strongman-WM in Fulda","synopsis":"Stromgman-WM in Fulda zieht Kraftsportler aus aller Welt an."},"pluginData":{},"geoBlocked":false},"playerId":"2565","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":true,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":false,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"__xsmall"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":false},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/hs/2024_06/240621093838_hsr_strongman_Poertner_Ost.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":39,"images":[{"kind":"preview","url":"images/strongman-100_v-1to1{size}.jpg"}],"title":"Strongman-WM in Fulda","synopsis":"Stromgman-WM in Fulda zieht Kraftsportler aus aller Welt an."},"pluginData":{},"geoBlocked":false},"playerId":"2565","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":false,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true}},"mediaBacklinkToStoryTeaser":{"link":{"url":"/audioseite","isTargetBlank":false},"readMoreScreenreader":"zum hessenschau.de Audio","title":"Musik macht deinen Tag","isForeignBrand":false,"readMore":"zur Audio-Einzelseite","hasIcon":false,"iconName":"extern"}},"teaseritem":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}},"teaserImage":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}}}},{"isHeadline":true,"text":"Zwischenüberschrift unter Audio"},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"paragraphBoxItem":{"isAudio":true,"isAudioOnDemand":true,"showFullSize":{"isTrue":false},"label":{"type":"audio","loca":"label_audio","byline":{"bylineText":"00:20 Min."}},"audioAuthor":"Karsten Hufer","showAirdate":true,"airdateDate":{"htmlDateTime":"2022-10-31T19:30+0200","htmlDate":"31.10.2022","date":"31.10.22","dateSeparatorTime":"31.10.22, 19:30"},"toModel":{"audioElement":{"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/sport/2022_03/220317235611_Hinteregger.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":20,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Das Eintracht-Tor in der Reportage: \"Hinteregger schädelt den rein\"","synopsis":"Eintracht Frankfurt steht im Viertelfinale der Europa League. Hier gibt es die emotionale Audio-Reportage des Hinteregger-Treffers."},"pluginData":{},"geoBlocked":false},"playerId":"2564","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":true,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":false,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":false},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/sport/2022_03/220317235611_Hinteregger.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":20,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Das Eintracht-Tor in der Reportage: \"Hinteregger schädelt den rein\"","synopsis":"Eintracht Frankfurt steht im Viertelfinale der Europa League. Hier gibt es die emotionale Audio-Reportage des Hinteregger-Treffers."},"pluginData":{},"geoBlocked":false},"playerId":"2564","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":false,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true}},"mediaBacklinkToStoryTeaser":{"link":{"url":"/audioseite","isTargetBlank":false},"readMoreScreenreader":"zum Audio","title":"Musik macht deinen Tag","isForeignBrand":false,"readMore":"zur Audio-Einzelseite","hasIcon":false,"iconName":"extern"}},"teaseritem":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}},"teaserImage":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}}}},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"isHeadline":true,"text":"Audio in halber Breite unter Bild in voller Breite"},{"paragraphBoxItem":{"isImage":true,"showFullSize":{"isTrue":true},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/buchmesse-fahnen-102_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/buchmesse-fahnen-102_v-16to9__small.jpg 320w, images/buchmesse-fahnen-102_v-16to9__medium.jpg 480w, images/buchmesse-fahnen-102_v-16to9__medium__extended.jpg 640w, images/buchmesse-fahnen-102_v-16to9.jpg 960w, images/buchmesse-fahnen-102_v-16to9__retina.jpg 1920w"}]}}},{"paragraphBoxItem":{"isAudio":true,"isAudioOnDemand":true,"showFullSize":{"isTrue":false},"label":{"type":"audio","loca":"label_audio","byline":{"bylineText":"00:20 Min."}},"audioAuthor":"Karsten Hufer","showAirdate":true,"airdateDate":{"htmlDateTime":"2022-10-31T19:30+0200","htmlDate":"31.10.2022","date":"31.10.22","dateSeparatorTime":"31.10.22, 19:30"},"toModel":{"audioElement":{"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/sport/2022_03/220317235611_Hinteregger.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":20,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Das Eintracht-Tor in der Reportage: \"Hinteregger schädelt den rein\"","synopsis":"Eintracht Frankfurt steht im Viertelfinale der Europa League. Hier gibt es die emotionale Audio-Reportage des Hinteregger-Treffers."},"pluginData":{},"geoBlocked":false},"playerId":"2567","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":true,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":false,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":false},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/sport/2022_03/220317235611_Hinteregger.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":20,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Das Eintracht-Tor in der Reportage: \"Hinteregger schädelt den rein\"","synopsis":"Eintracht Frankfurt steht im Viertelfinale der Europa League. Hier gibt es die emotionale Audio-Reportage des Hinteregger-Treffers."},"pluginData":{},"geoBlocked":false},"playerId":"2567","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":false,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true}},"mediaBacklinkToStoryTeaser":{"link":{"url":"/audioseite","isTargetBlank":false},"readMoreScreenreader":"zum Audio","title":"Musik macht deinen Tag","isForeignBrand":false,"readMore":"zur Audio-Einzelseite","hasIcon":false,"iconName":"extern"}},"teaseritem":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}},"teaserImage":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}}}},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}}]}
+{"copytextParagraph":[{"isHeadline":true,"text":"Copytext mit Audio"},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='copytext-ds__link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"paragraphBoxItem":{"isAudio":true,"isAudioOnDemand":true,"showFullSize":{"isTrue":true},"label":{"type":"audio","loca":"label_audio","byline":{"bylineText":"00:39 Min."}},"copyright":"hr","audioAuthor":"Michael Pörtner","showAirdate":true,"airdateDate":{"htmlDateTime":"2024-06-21T14:30+0200","htmlDate":"21.06.2024","date":"21.06.24","dateSeparatorTime":"21.06.24, 14:30"},"toModel":{"audioElement":{"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"__xsmall"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/hs/2024_06/240621093838_hsr_strongman_Poertner_Ost.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":39,"images":[{"kind":"preview","url":"images/strongman-100_v-1to1{size}.jpg"}],"title":"Strongman-WM in Fulda","synopsis":"Stromgman-WM in Fulda zieht Kraftsportler aus aller Welt an."},"pluginData":{},"geoBlocked":false},"playerId":"2565","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":true,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":false,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"__xsmall"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":false},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/hs/2024_06/240621093838_hsr_strongman_Poertner_Ost.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":39,"images":[{"kind":"preview","url":"images/strongman-100_v-1to1{size}.jpg"}],"title":"Strongman-WM in Fulda","synopsis":"Stromgman-WM in Fulda zieht Kraftsportler aus aller Welt an."},"pluginData":{},"geoBlocked":false},"playerId":"2565","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":false,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true}},"mediaBacklinkToStoryTeaser":{"link":{"url":"/audioseite","isTargetBlank":false},"readMoreScreenreader":"zum hessenschau.de Audio","title":"Musik macht deinen Tag","isForeignBrand":false,"readMore":"zur Audio-Einzelseite","hasIcon":false,"iconName":"extern"}},"teaseritem":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}},"teaserImage":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}}}},{"isHeadline":true,"text":"Zwischenüberschrift unter Audio"},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='copytext-ds__link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"paragraphBoxItem":{"isAudio":true,"isAudioOnDemand":true,"showFullSize":{"isTrue":false},"label":{"type":"audio","loca":"label_audio","byline":{"bylineText":"00:20 Min."}},"audioAuthor":"Karsten Hufer","showAirdate":true,"airdateDate":{"htmlDateTime":"2022-10-31T19:30+0200","htmlDate":"31.10.2022","date":"31.10.22","dateSeparatorTime":"31.10.22, 19:30"},"toModel":{"audioElement":{"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/sport/2022_03/220317235611_Hinteregger.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":20,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Das Eintracht-Tor in der Reportage: \"Hinteregger schädelt den rein\"","synopsis":"Eintracht Frankfurt steht im Viertelfinale der Europa League. Hier gibt es die emotionale Audio-Reportage des Hinteregger-Treffers."},"pluginData":{},"geoBlocked":false},"playerId":"2564","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":true,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":false,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":false},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/sport/2022_03/220317235611_Hinteregger.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":20,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Das Eintracht-Tor in der Reportage: \"Hinteregger schädelt den rein\"","synopsis":"Eintracht Frankfurt steht im Viertelfinale der Europa League. Hier gibt es die emotionale Audio-Reportage des Hinteregger-Treffers."},"pluginData":{},"geoBlocked":false},"playerId":"2564","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":false,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true}},"mediaBacklinkToStoryTeaser":{"link":{"url":"/audioseite","isTargetBlank":false},"readMoreScreenreader":"zum Audio","title":"Musik macht deinen Tag","isForeignBrand":false,"readMore":"zur Audio-Einzelseite","hasIcon":false,"iconName":"extern"}},"teaseritem":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}},"teaserImage":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}}}},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='copytext-ds__link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}},{"isHeadline":true,"text":"Audio in halber Breite unter Bild in voller Breite"},{"paragraphBoxItem":{"isImage":true,"showFullSize":{"isTrue":true},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/buchmesse-fahnen-102_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/buchmesse-fahnen-102_v-16to9__small.jpg 320w, images/buchmesse-fahnen-102_v-16to9__medium.jpg 480w, images/buchmesse-fahnen-102_v-16to9__medium__extended.jpg 640w, images/buchmesse-fahnen-102_v-16to9.jpg 960w, images/buchmesse-fahnen-102_v-16to9__retina.jpg 1920w"}]}}},{"paragraphBoxItem":{"isAudio":true,"isAudioOnDemand":true,"showFullSize":{"isTrue":false},"label":{"type":"audio","loca":"label_audio","byline":{"bylineText":"00:20 Min."}},"audioAuthor":"Karsten Hufer","showAirdate":true,"airdateDate":{"htmlDateTime":"2022-10-31T19:30+0200","htmlDate":"31.10.2022","date":"31.10.22","dateSeparatorTime":"31.10.22, 19:30"},"toModel":{"audioElement":{"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/sport/2022_03/220317235611_Hinteregger.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":20,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Das Eintracht-Tor in der Reportage: \"Hinteregger schädelt den rein\"","synopsis":"Eintracht Frankfurt steht im Viertelfinale der Europa League. Hier gibt es die emotionale Audio-Reportage des Hinteregger-Treffers."},"pluginData":{},"geoBlocked":false},"playerId":"2567","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":true,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":false,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":false},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/sport/2022_03/220317235611_Hinteregger.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":20,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Das Eintracht-Tor in der Reportage: \"Hinteregger schädelt den rein\"","synopsis":"Eintracht Frankfurt steht im Viertelfinale der Europa League. Hier gibt es die emotionale Audio-Reportage des Hinteregger-Treffers."},"pluginData":{},"geoBlocked":false},"playerId":"2567","type":"audioOndemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.0b83d962.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.8.3.82603554.js","isAutoplay":false,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true}},"mediaBacklinkToStoryTeaser":{"link":{"url":"/audioseite","isTargetBlank":false},"readMoreScreenreader":"zum Audio","title":"Musik macht deinen Tag","isForeignBrand":false,"readMore":"zur Audio-Einzelseite","hasIcon":false,"iconName":"extern"}},"teaseritem":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}},"teaserImage":{"isImage":true,"showFullSize":{"isTrue":false},"showPortrait":{"isTrue":false},"caption":"Zum Glück ragt Hessens höchster Berg, die Wasserkuppe, gelegentlich aus der derzeitigen Nebelsuppe heraus, und so gelang mit dem Sternenteleskop ein Blick auf den magischen Rosetten-Nebel, einer Himmelsregion, in der gerade neue Sterne geboren werden. - Diese spektakuläre Momentaufnahme hat uns hessenschau.de-Nutzer Michael Keusgen zukommen lassen","copyrightWithLinks":"Karsten Hufer","imageJson":"Beispiel JSON","responsiveImage":{"asPicture":false,"asImage":true,"fallback":"images/lehrerin-ukraine-104_v-16to9__medium.jpg","sources":[{"sizes":"(min-width: 1024px) 960px, (min-width: 640px) calc(100vw - 4rem), 100vw","srcset":"images/lehrerin-ukraine-104_v-16to9__small.jpg 320w, images/lehrerin-ukraine-104_v-16to9__medium.jpg 480w, images/lehrerin-ukraine-104_v-16to9__medium__extended.jpg 640w, images/lehrerin-ukraine-104_v-16to9.jpg 960w, images/lehrerin-ukraine-104_v-16to9__retina.jpg 1920w"}]}}}},{"isParagraph":true,"text":{"split":[{"isText":true,"text":"Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod <strong>tempor invidunt</strong> ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata <i>sanctus est Lorem ipsum</i> dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut <a href='#' class='copytext-ds__link'>labore et dolore</a> magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod."}]}}]}