[taskboard] fit task columns to workspace width

This commit is contained in:
2026-03-07 13:39:02 -08:00
parent 2bf137a437
commit 195ef5b2ca

View File

@@ -89,12 +89,11 @@ export function TasksClient({
<Badge variant="outline">{tasks.length} total tasks</Badge> <Badge variant="outline">{tasks.length} total tasks</Badge>
</div> </div>
<div className="overflow-x-auto pb-3"> <div className="grid gap-4 xl:grid-cols-5">
<div className="flex min-w-max gap-4">
{COLUMNS.map((column) => { {COLUMNS.map((column) => {
const columnTasks = tasks.filter((task) => task.status === column); const columnTasks = tasks.filter((task) => task.status === column);
return ( return (
<Card className="flex min-h-[560px] w-[340px] shrink-0 flex-col border-white/10 bg-slate-950/35 xl:w-[360px]" key={column}> <Card className="flex min-h-[560px] min-w-0 flex-col border-white/10 bg-slate-950/35" key={column}>
<CardHeader className="pb-4"> <CardHeader className="pb-4">
<CardTitle className="flex items-center justify-between text-base"> <CardTitle className="flex items-center justify-between text-base">
<span>{column}</span> <span>{column}</span>
@@ -165,7 +164,6 @@ export function TasksClient({
</Card> </Card>
); );
})} })}
</div>
</div> </div>
</div> </div>