From 1d1daec31be133edb34260964b28be9b67103a5a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B6rn=20Fromme?= <fromme@dreipunktnull.com>
Date: Tue, 12 Apr 2022 18:25:29 +0200
Subject: [PATCH] Fix horizontal scrolling of tables in mobile view

---
 .../ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue    | 2 +-
 .../ext/ep_theme/Resources/Private/Partials/Pricetable.html     | 2 +-
 .../Resources/Private/Templates/AjaxTable/EventPricetable.html  | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue
index b197fc7b..e7d72122 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue
@@ -3,7 +3,7 @@
         <h1 class="mb-4">
             Meine Buchungen
         </h1>
-        <div class="w-full max-w-full overflow-x-auto">
+        <div class="w-full max-w-full overflow-x-scroll md:overflow-x-auto">
             <table class="min-w-full border border-gray-200 border-collapse mb-8 text-sm">
                 <thead>
                     <tr>
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Pricetable.html b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Pricetable.html
index badcfca7..a5d46ed3 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Pricetable.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Partials/Pricetable.html
@@ -7,7 +7,7 @@
             <f:render partial="NotBookable" arguments="{_all}"/>
         </f:then>
         <f:else>
-            <div class="w-full max-w-full overflow-x-auto"
+            <div class="w-full max-w-full overflow-x-scroll md:overflow-x-auto"
                  data-controller="pricetable"
                  data-pricetable-show-all-rows-value="true">
                 <table class="min-w-full border border-gray-200 border-collapse mb-8">
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Templates/AjaxTable/EventPricetable.html b/public/typo3conf/ext/ep_theme/Resources/Private/Templates/AjaxTable/EventPricetable.html
index 04dce2dd..8811421e 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Templates/AjaxTable/EventPricetable.html
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Templates/AjaxTable/EventPricetable.html
@@ -17,7 +17,7 @@
     </f:section>
 
     <f:section name="Table">
-        <div class="w-full max-w-full overflow-x-auto">
+        <div class="w-full max-w-full overflow-x-scroll md:overflow-x-auto">
             <table class="min-w-full border border-gray-200 border-collapse mb-8">
                 <f:for each="{categories}" as="category" key="categoryKey">
                     <f:if condition="{v:variable.get(name: 'pricetable.{categoryKey}', useRawKeys: 1) -> f:count()} > 0">