feat(ui): adjust roo font size

packages/types/src/vscode.ts

@@ -54,6 +54,8 @@ export const commandIds = [
 	"acceptInput",
 	"focusPanel",
 	"toggleAutoApprove",
+	"increaseFontSize",
+	"decreaseFontSize",
 ] as const
 
 export type CommandId = (typeof commandIds)[number]

src/activate/registerCommands.ts

@@ -233,6 +233,38 @@ const getCommandsMap = ({ context, outputChannel, provider }: RegisterCommandOpt
 			action: "toggleAutoApprove",
 		})
 	},
+	increaseFontSize: async () => {
+		const config = vscode.workspace.getConfiguration(Package.name)
+		const currentMultiplier = config.get<number>("fontSizeMultiplier") || 1.0
+		const newMultiplier = Math.min(Math.round((currentMultiplier + 0.1) * 10) / 10, 3.0)
+
+		await config.update("fontSizeMultiplier", newMultiplier, vscode.ConfigurationTarget.Global)
+
+		const visibleProvider = getVisibleProviderOrLog(outputChannel)
+		if (visibleProvider) {
+			visibleProvider.postMessageToWebview({
+				type: "action",
+				action: "fontSizeChanged",
+				fontSizeMultiplier: newMultiplier,
+			})
+		}
+	},
+	decreaseFontSize: async () => {
+		const config = vscode.workspace.getConfiguration(Package.name)
+		const currentMultiplier = config.get<number>("fontSizeMultiplier") || 1.0
+		const newMultiplier = Math.min(Math.round((currentMultiplier - 0.1) * 10) / 10, 3.0)
+
+		await config.update("fontSizeMultiplier", newMultiplier, vscode.ConfigurationTarget.Global)
+
+		const visibleProvider = getVisibleProviderOrLog(outputChannel)
+		if (visibleProvider) {
+			visibleProvider.postMessageToWebview({
+				type: "action",
+				action: "fontSizeChanged",
+				fontSizeMultiplier: newMultiplier,
+			})
+		}
+	},
 })
 
 export const openClineInNewTab = async ({ context, outputChannel }: Omit<RegisterCommandOptions, "provider">) => {

src/core/webview/ClineProvider.ts

@@ -838,6 +838,15 @@ export class ClineProvider
 				// Sends latest theme name to webview
 				await this.postMessageToWebview({ type: "theme", text: JSON.stringify(await getTheme()) })
 			}
+			if (e && e.affectsConfiguration(`${Package.name}.fontSizeMultiplier`)) {
+				const fontSizeMultiplier =
+					vscode.workspace.getConfiguration(Package.name).get<number>("fontSizeMultiplier") || 1.0
+				await this.postMessageToWebview({
+					type: "action",
+					action: "fontSizeChanged",
+					fontSizeMultiplier,
+				})
+			}
 		})
 		this.webviewDisposables.push(configDisposable)
 
@@ -1817,6 +1826,10 @@ export class ClineProvider
 			featureRoomoteControlEnabled,
 		} = await this.getState()
 
+		// Get font size multiplier from VSCode settings
+		const fontSizeMultiplier =
+			vscode.workspace.getConfiguration(Package.name).get<number>("fontSizeMultiplier") || 1.0
+
 		let cloudOrganizations: CloudOrganizationMembership[] = []
 
 		try {
@@ -1964,6 +1977,7 @@ export class ClineProvider
 			openRouterImageGenerationSelectedModel,
 			openRouterUseMiddleOutTransform,
 			featureRoomoteControlEnabled,
+			fontSizeMultiplier,
 		}
 	}
 
@@ -2195,6 +2209,8 @@ export class ClineProvider
 					return false
 				}
 			})(),
+			fontSizeMultiplier:
+				vscode.workspace.getConfiguration(Package.name).get<number>("fontSizeMultiplier") || 1.0,
 		}
 	}
 

src/core/webview/__tests__/ClineProvider.spec.ts

@@ -557,6 +557,7 @@ describe("ClineProvider", () => {
 			remoteControlEnabled: false,
 			taskSyncEnabled: false,
 			featureRoomoteControlEnabled: false,
+			fontSizeMultiplier: 1,
 		}
 
 		const message: ExtensionMessage = {

src/package.json

@@ -179,6 +179,16 @@
 				"command": "roo-cline.toggleAutoApprove",
 				"title": "%command.toggleAutoApprove.title%",
 				"category": "%configuration.title%"
+			},
+			{
+				"command": "roo-cline.increaseFontSize",
+				"title": "%command.increaseFontSize.title%",
+				"category": "%configuration.title%"
+			},
+			{
+				"command": "roo-cline.decreaseFontSize",
+				"title": "%command.decreaseFontSize.title%",
+				"category": "%configuration.title%"
 			}
 		],
 		"menus": {
@@ -429,6 +439,13 @@
 					"minimum": 1,
 					"maximum": 200,
 					"description": "%settings.codeIndex.embeddingBatchSize.description%"
+				},
+				"roo-cline.fontSizeMultiplier": {
+					"type": "number",
+					"default": 1,
+					"minimum": 0.5,
+					"maximum": 3,
+					"description": "%settings.fontSizeMultiplier.description%"
 				}
 			}
 		}