From d78d3f65e2c9211e3e6b8387873b88f90f78b9c3 Mon Sep 17 00:00:00 2001
From: Stefan Hauke <s.hauke@intershop.de>
Date: Thu, 1 Feb 2024 10:01:36 +0100
Subject: [PATCH] fix: prevent rendering errors for text on enhanced image
 teaser caused by Angular hydration

* Angular hydration needs a valid HTML structure that was not given with the surrounding <p> tag for the text/description on the image
* use <div> instead of <p> element for freestyle HTML on enhanced image teaser to prevent rendering errors
* see https://angular.io/guide/hydration#valid-html-structure
---
 .../cms-image-enhanced/cms-image-enhanced.component.html      | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/app/shared/cms/components/cms-image-enhanced/cms-image-enhanced.component.html b/src/app/shared/cms/components/cms-image-enhanced/cms-image-enhanced.component.html
index d773e64319..705a75bdaf 100644
--- a/src/app/shared/cms/components/cms-image-enhanced/cms-image-enhanced.component.html
+++ b/src/app/shared/cms/components/cms-image-enhanced/cms-image-enhanced.component.html
@@ -39,11 +39,11 @@
     <div class="enhanced-image-text">
       <h1 *ngIf="pagelet.hasParam('Heading1')">{{ pagelet.stringParam('Heading1') }}</h1>
       <h2 *ngIf="pagelet.hasParam('Heading2')">{{ pagelet.stringParam('Heading2') }}</h2>
-      <p
+      <div
         *ngIf="pagelet.hasParam('Description')"
         class="d-none d-sm-inline"
         [ishServerHtml]="pagelet.stringParam('Description')"
-      ></p>
+      ></div>
       <a
         *ngIf="pagelet.hasParam('Link') && pagelet.hasParam('LinkText')"
         [routerLink]="routerLink(pagelet, 'Link')"