fix(ui): stop the worktrees table from always stacking inside settings (#103899)

steipete · web-flow · commit 7af7e41eedf4 · 2026-07-10T19:46:37.000+01:00
diff --git a/ui/src/styles/components.css b/ui/src/styles/components.css
@@ -3041,14 +3041,16 @@
   min-width: 180px;
 }
 
-@media (max-width: 1100px) {
+/* Settings caps .settings-workspace at 1120px, so the table container is ~1080px
+   wide; a 1100px stack breakpoint would collapse the grid at every window size. */
+@media (max-width: 900px) {
   .worktrees-table .table-head,
   .worktrees-table .table-row {
     grid-template-columns: 1fr;
   }
 }
 
-@container (max-width: 1100px) {
+@container (max-width: 900px) {
   .worktrees-table .table-head,
   .worktrees-table .table-row {
     grid-template-columns: 1fr;

Original file line number	Diff line number	Diff line change
`@@ -3041,14 +3041,16 @@`
`3041`	`3041`	`min-width: 180px;`
`3042`	`3042`	`}`
`3043`	`3043`
`3044`		`-@media (max-width: 1100px) {`
	`3044`	`+/* Settings caps .settings-workspace at 1120px, so the table container is ~1080px`
	`3045`	`+ wide; a 1100px stack breakpoint would collapse the grid at every window size. */`
	`3046`	`+@media (max-width: 900px) {`
`3045`	`3047`	`.worktrees-table .table-head,`
`3046`	`3048`	`.worktrees-table .table-row {`
`3047`	`3049`	`grid-template-columns: 1fr;`
`3048`	`3050`	`}`
`3049`	`3051`	`}`
`3050`	`3052`
`3051`		`-@container (max-width: 1100px) {`
	`3053`	`+@container (max-width: 900px) {`
`3052`	`3054`	`.worktrees-table .table-head,`
`3053`	`3055`	`.worktrees-table .table-row {`
`3054`	`3056`	`grid-template-columns: 1fr;`