Merge pull request RooCodeInc#732 from RooVetGit/fix_mode_wrapping

Make list of modes multi-line on the prompts page

Author: mrubens

.changeset/breezy-badgers-refuse.md

@@ -0,0 +1,5 @@
+---
+"roo-cline": patch
+---
+
+Visual cleanup to the list of modes on the prompts tab

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