diff --git a/client/src/components/lanes/LaneStripCard.tsx b/client/src/components/lanes/LaneStripCard.tsx index 865c99b..cd447b7 100644 --- a/client/src/components/lanes/LaneStripCard.tsx +++ b/client/src/components/lanes/LaneStripCard.tsx @@ -1,9 +1,10 @@ /** - * @file The compact lane tile used in the Workspace's vertical lane list. It - * carries only what you need to pick a lane — which lane, is it alive, what - * stage, how far — because the full card, its controls and its working-copy - * facts live in the detail panel beside it. Keeping the tile small and full - * width is what lets many lanes stay scannable in one scrolling column. + * @file The compact lane tile used in the Workspace's horizontal lane strip. + * It carries only what you need to pick a lane — which lane, is it alive, + * what stage, how far — because the full card, its controls and its + * working-copy facts live in the detail panel below it. Keeping the tile + * small and fixed-width is what lets many lanes stay scannable in one + * scrolling row. * @author Nguyễn Ngọc Trí Vĩ */ @@ -42,7 +43,7 @@ export default function LaneStripCard({ aria-pressed={selected} onClick={onSelect} title={lane.cwd} - className={`w-full shrink-0 rounded-lg border p-3 text-left shadow-sm transition-colors ${ + className={`w-56 shrink-0 rounded-lg border p-3 text-left shadow-sm transition-colors ${ selected ? "border-accent bg-accent/10" : "border-border bg-surface-2 hover:border-border-light hover:bg-surface-3" diff --git a/client/src/pages/Workspace.tsx b/client/src/pages/Workspace.tsx index 55b7be2..0cb083f 100644 --- a/client/src/pages/Workspace.tsx +++ b/client/src/pages/Workspace.tsx @@ -521,15 +521,11 @@ export function Workspace() { - {/* Lane list + detail live side by side so neither can cover the other: - the list is a scrolling column (holds any number of lanes), the - detail/console area to its right never has to compete with it for - vertical space. */} -
-
+ {/* Lane strip + detail stack vertically: the strip is a horizontally + scrolling row (holds any number of lanes), the detail/console area + below it gets the full width and never competes for it. */} +
+
{lanes.map((l) => ( Run 1`] = `