Merge pull request #732 from RooVetGit/fix_mode_wrapping

Make list of modes multi-line on the prompts page
RooVetGit · Feb 2, 2025 · cddd92b · cddd92b
2 parents f493619 + a01d923
commit cddd92b
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 10 deletions.
diff --git a/.changeset/breezy-badgers-refuse.md b/.changeset/breezy-badgers-refuse.md
@@ -0,0 +1,5 @@
+---
+"roo-cline": patch
+---
+
+Visual cleanup to the list of modes on the prompts tab
diff --git a/webview-ui/src/components/prompts/PromptsView.tsx b/webview-ui/src/components/prompts/PromptsView.tsx
@@ -472,13 +472,11 @@ const PromptsView = ({ onDone }: PromptsViewProps) => {
 					<div
 						style={{
 							display: "flex",
-							gap: "16px",
+							gap: "8px",
 							alignItems: "center",
 							marginBottom: "12px",
-							overflowX: "auto",
-							flexWrap: "nowrap",
-							paddingBottom: "4px",
-							paddingRight: "20px",
+							flexWrap: "wrap",
+							padding: "4px 0",
 						}}>
 						{modes.map((modeConfig) => {
 							const isActive = mode === modeConfig.slug
@@ -859,13 +857,11 @@ const PromptsView = ({ onDone }: PromptsViewProps) => {
 					<div
 						style={{
 							display: "flex",
-							gap: "16px",
+							gap: "8px",
 							alignItems: "center",
 							marginBottom: "12px",
-							overflowX: "auto",
-							flexWrap: "nowrap",
-							paddingBottom: "4px",
-							paddingRight: "20px",
+							flexWrap: "wrap",
+							padding: "4px 0",
 						}}>
 						{Object.keys(supportPrompt.default).map((type) => (
 							<button