fix: move resize handles to left edge of columns

Handles now sit on the left edge (the boundary between columns).
Dragging feels natural — you pull the dividing line between two columns.
Wider hit area (w-2) for easier grabbing.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Gjermund Høsøien Wiggen
2026-06-09 22:08:36 +02:00
parent d7a5b5ba1d
commit 30108c7600

View File

@@ -896,13 +896,13 @@ function TicketWorkbenchContent() {
className="relative border-r border-border/60 px-3 align-middle last:border-r-0" className="relative border-r border-border/60 px-3 align-middle last:border-r-0"
style={{ display: "table-cell", width: col.key === "subject" ? undefined : col.width }} style={{ display: "table-cell", width: col.key === "subject" ? undefined : col.width }}
> >
<div
className="absolute left-0 top-0 h-full w-2 -ml-1 cursor-col-resize hover:bg-primary/40 z-10"
onMouseDown={(e) => handleColumnResize(col.key, e)}
/>
<span className="text-[10px] font-semibold uppercase text-muted-foreground/60 truncate block"> <span className="text-[10px] font-semibold uppercase text-muted-foreground/60 truncate block">
{col.label} {col.label}
</span> </span>
<div
className="absolute right-0 top-0 h-full w-1 cursor-col-resize hover:bg-primary/40"
onMouseDown={(e) => handleColumnResize(col.key, e)}
/>
</div> </div>
))} ))}
<div style={{ display: "table-cell", width: 48 }} /> <div style={{ display: "table-cell", width: 48 }} />