From 9982027d908896fae708213225517ba949abf328 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B6rn=20Fromme?= <fromme@dreipunktnull.com>
Date: Mon, 14 Mar 2022 15:52:48 +0100
Subject: [PATCH] Improve hotel list layout in case of empty list

---
 .../Private/Templates/Product/HotelList.html  | 19 ++++++++++++-------
 1 file changed, 12 insertions(+), 7 deletions(-)

diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Templates/Product/HotelList.html b/public/typo3conf/ext/ep_theme/Resources/Private/Templates/Product/HotelList.html
index d687ca15..444c647f 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Templates/Product/HotelList.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Templates/Product/HotelList.html
@@ -15,11 +15,11 @@
                     <div data-rte-content>
                         {product.teaserLong -> f:format.html()}
                     </div>
-                    <div class="headerbar">
-                        Wähle deine Unterkunft
-                    </div>
                     <f:if condition="{hotels}">
                         <f:then>
+                            <div class="headerbar">
+                                Wähle deine Unterkunft
+                            </div>
                             <div class="flex flex-col space-y-4 md:space-y-8">
                                 <f:for each="{hotels}" as="item">
                                     <f:render partial="Product/Teaser" section="Teaser" arguments="{
@@ -43,10 +43,15 @@
                             </div>
                         </f:then>
                         <f:else>
-                            <div class="alert alert-info">
-                                Die von dir gewählte Reise ist aktuell nicht buchbar, aber wir helfen dir gerne dabei,
-                                eine andere Reise zu finden. Ruf uns an unter <a href="tel:{settings.phoneNumber -> v:format.pregReplace(pattern: '/[\-\s]/', replacement: '')}" title="Service Telefon anrufen" rel="nofollow">{settings.phoneNumber}</a>
-                                oder schreibe an <f:link.email email="info@ep-reisen.de"/>.
+                            <div class="flex items-center space-x-4 text-lg p-4 mb-4 bg-gray-50">
+                                <svg class="w-6 h-6">
+                                    <use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-emoji-sad"></use>
+                                </svg>
+                                <div class="flex-1" data-rte-content>
+                                    Die von dir gewählte Reise ist aktuell nicht buchbar, aber wir helfen dir gerne dabei,
+                                    eine andere Reise zu finden. Ruf uns an unter <a href="tel:{settings.phoneNumber -> v:format.pregReplace(pattern: '/[\-\s]/', replacement: '')}" title="Service Telefon anrufen" rel="nofollow">{settings.phoneNumber}</a>
+                                    oder schreibe an <f:link.email email="info@ep-reisen.de"/>.
+                                </div>
                             </div>
                         </f:else>
                     </f:if>