From 6ba7faa69682d755b83a4f4d394a6f8f21104faf Mon Sep 17 00:00:00 2001
From: xiaomai <xsbugh@gmail.com>
Date: Sat, 9 May 2026 14:39:26 +0800
Subject: [PATCH] fix(bookings): correct table overflow and width styling

Remove overflow-x-auto from the table wrapper
Apply minimum width using the UTable ui prop instead of standard classes
---
 app/pages/bookings/index.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/app/pages/bookings/index.vue b/app/pages/bookings/index.vue
index 3380d3a..77064ce 100644
--- a/app/pages/bookings/index.vue
+++ b/app/pages/bookings/index.vue
@@ -189,7 +189,7 @@
           </div>
         </template>
 
-        <div class="overflow-x-auto">
+        <div>
           <UTable
             :data="filteredBookings"
             :columns="columns"
@@ -197,7 +197,8 @@
             :empty="searchQuery.trim() ? 'No matching bookings found.' : 'No bookings available yet.'"
             sticky="header"
             caption="Bookings"
-            class="compact-table min-w-[1280px]"
+            class="compact-table"
+            :ui="{ base: 'min-w-[1280px]' }"
           >
             <template #customerName-cell="{ row }">
               <div class="min-w-0 space-y-0.5 py-0.5">