From f8e8fc4db1b3315f0387717bbda6196e455b7d1c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?V=C3=ADctor=20Falc=C3=B3n?= Date: Tue, 17 Feb 2026 08:45:07 +0100 Subject: [PATCH] Fix horizontal scroll on transactions table (#127) ## Summary - Make the description column fill all remaining space on md+ screens by replacing fixed `max-w` breakpoints with `md:w-full md:min-w-0 md:overflow-hidden` - Eliminates horizontal scrolling on md, lg, and xl viewports without modifying other columns ## Test plan - [x] Verify no horizontal scroll on md (768px), lg (1024px), and xl (1280px) viewports - [x] Verify description text truncates correctly with ellipsis - [x] Verify mobile/sm behavior is unchanged (max-w-[200px] / sm:max-w-[400px]) - [x] Verify labels and notes still display within the description cell --- resources/js/components/transactions/transaction-columns.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/resources/js/components/transactions/transaction-columns.tsx b/resources/js/components/transactions/transaction-columns.tsx index c2a79ffa..736a59ba 100644 --- a/resources/js/components/transactions/transaction-columns.tsx +++ b/resources/js/components/transactions/transaction-columns.tsx @@ -184,7 +184,7 @@ export function createTransactionColumns({ meta: { label: __('Description'), cellClassName: - 'max-w-[200px] sm:max-w-[400px] md:max-w-[400px] lg:max-w-[550px] xl:max-w-full xl:w-full', + 'max-w-[200px] sm:max-w-[400px] md:max-w-none md:w-full md:min-w-0 md:overflow-hidden', }, header: () => __('Description'), cell: ({ row, table }) => {