From b2b981ef1413ccc70ff430b3cacd3b391ae03d98 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bjo=CC=88rn=20Fromme?= <fromme@dreipunktnull.com>
Date: Tue, 21 Dec 2021 17:27:21 +0100
Subject: [PATCH] Improve margins of sidebar labels

---
 .../Private/Partials/Region/Webcam.html       |  2 +-
 .../Private/Partials/RegionMaps.html          |  2 +-
 .../Private/Templates/Product/Detail.html     | 35 +++++++++++--------
 3 files changed, 22 insertions(+), 17 deletions(-)

diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Region/Webcam.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Region/Webcam.html
index c2c0758e..7dcd350f 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Region/Webcam.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Region/Webcam.html
@@ -1,6 +1,6 @@
 <f:if condition="{region.webcam.available}">
     <div class="bg-gray-50 p-4 mb-8">
-        <p class="font-bold">
+        <p class="font-bold mb-2">
             Webcam
         </p>
         <a href="{region.webcam.url}"
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/RegionMaps.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/RegionMaps.html
index ad9ce74f..734266a7 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/RegionMaps.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/RegionMaps.html
@@ -1,7 +1,7 @@
 <f:if condition="{region.regionMaps}">
     <div class="bg-gray-50 p-4 mb-4"
          data-controller="lightbox">
-        <p class="font-bold mb-1">
+        <p class="font-bold mb-2">
             Pistenplan
         </p>
         <f:for each="{region.regionMaps}" as="regionMap" iteration="iteration">
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Templates/Product/Detail.html b/public/typo3conf/ext/ep_theme/Resources/Private/Templates/Product/Detail.html
index 20a6e0c0..91b9ecae 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Templates/Product/Detail.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Templates/Product/Detail.html
@@ -205,7 +205,7 @@
             </div>
         </f:if>
         <div class="bg-gray-50 p-4 mb-4">
-            <p class="font-bold">
+            <p class="font-bold mb-2">
                 Lage
             </p>
             <div class="w-full aspect-w-16 aspect-h-9"
@@ -354,20 +354,25 @@
 
     <f:section name="SidebarGallery">
         <f:if condition="{product.images}">
-            <div class="bg-gray-50 p-4 mb-4 grid grid-cols-4 gap-2"
-                 data-controller="lightbox">
-                <f:for each="{product.images}" as="image" iteration="iteration">
-                    <a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}"
-                       data-lightbox-target="thumb"
-                       data-lightbox-index="{iteration.cycle}"
-                       data-lightbox-caption="{image.originalResource.description}"
-                       data-action="lightbox#open">
-                        <img data-src="{f:uri.image(image: image, width: '160', height: '160c+100')}"
-                             class="block w-full h-auto lazyload"
-                             alt="{image.alternative}"
-                             title="{image.title}">
-                    </a>
-                </f:for>
+            <div class="bg-gray-50 p-4 mb-4">
+                <p class="font-bold mb-2">
+                    Galerie
+                </p>
+                <div class="grid grid-cols-4 gap-2"
+                     data-controller="lightbox">
+                    <f:for each="{product.images}" as="image" iteration="iteration">
+                        <a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}"
+                           data-lightbox-target="thumb"
+                           data-lightbox-index="{iteration.cycle}"
+                           data-lightbox-caption="{image.originalResource.description}"
+                           data-action="lightbox#open">
+                            <img data-src="{f:uri.image(image: image, width: '160', height: '160c+100')}"
+                                 class="block w-full h-auto lazyload"
+                                 alt="{image.alternative}"
+                                 title="{image.title}">
+                        </a>
+                    </f:for>
+                </div>
             </div>
         </f:if>
     </f:section>