diff --git a/packages/types/src/vscode.ts b/packages/types/src/vscode.ts index d22ebdab22..91c3cc456a 100644 --- a/packages/types/src/vscode.ts +++ b/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] diff --git a/src/activate/registerCommands.ts b/src/activate/registerCommands.ts index 41c127333d..3da8c15d18 100644 --- a/src/activate/registerCommands.ts +++ b/src/activate/registerCommands.ts @@ -15,7 +15,6 @@ import { handleNewTask } from "./handleTask" import { CodeIndexManager } from "../services/code-index/manager" import { importSettingsWithFeedback } from "../core/config/importExport" import { MdmService } from "../services/mdm/MdmService" -import { t } from "../i18n" /** * Helper to get the visible ClineProvider instance or log if not found. @@ -233,6 +232,20 @@ const getCommandsMap = ({ context, outputChannel, provider }: RegisterCommandOpt action: "toggleAutoApprove", }) }, + increaseFontSize: async () => { + const config = vscode.workspace.getConfiguration(Package.name) + const currentMultiplier = config.get("fontSizeMultiplier") || 1.0 + const newMultiplier = Math.min(Math.round((currentMultiplier + 0.1) * 10) / 10, 3.0) + + await config.update("fontSizeMultiplier", newMultiplier, vscode.ConfigurationTarget.Global) + }, + decreaseFontSize: async () => { + const config = vscode.workspace.getConfiguration(Package.name) + const currentMultiplier = config.get("fontSizeMultiplier") || 1.0 + const newMultiplier = Math.max(Math.round((currentMultiplier - 0.1) * 10) / 10, 0.5) + + await config.update("fontSizeMultiplier", newMultiplier, vscode.ConfigurationTarget.Global) + }, }) export const openClineInNewTab = async ({ context, outputChannel }: Omit) => { diff --git a/src/core/webview/ClineProvider.ts b/src/core/webview/ClineProvider.ts index 2c20d0939c..ef9b70fe0a 100644 --- a/src/core/webview/ClineProvider.ts +++ b/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("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("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("fontSizeMultiplier") || 1.0, } } diff --git a/src/core/webview/__tests__/ClineProvider.spec.ts b/src/core/webview/__tests__/ClineProvider.spec.ts index bcc9d544c2..226d9dab72 100644 --- a/src/core/webview/__tests__/ClineProvider.spec.ts +++ b/src/core/webview/__tests__/ClineProvider.spec.ts @@ -557,6 +557,7 @@ describe("ClineProvider", () => { remoteControlEnabled: false, taskSyncEnabled: false, featureRoomoteControlEnabled: false, + fontSizeMultiplier: 1, } const message: ExtensionMessage = { diff --git a/src/package.json b/src/package.json index 3d78345e7f..634be80630 100644 --- a/src/package.json +++ b/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%" } } } diff --git a/src/package.nls.ca.json b/src/package.nls.ca.json index 902f798cbe..89b232d3aa 100644 --- a/src/package.nls.ca.json +++ b/src/package.nls.ca.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "Explicar Aquesta Ordre", "command.acceptInput.title": "Acceptar Entrada/Suggeriment", "command.toggleAutoApprove.title": "Alternar Auto-Aprovació", + "command.increaseFontSize.title": "Augmentar Mida de la Font", + "command.decreaseFontSize.title": "Disminuir Mida de la Font", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Activa la càrrega de fitxers AGENTS.md per a regles específiques de l'agent (vegeu https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Temps màxim en segons per esperar les respostes de l'API (0 = sense temps d'espera, 1-3600s, per defecte: 600s). Es recomanen valors més alts per a proveïdors locals com LM Studio i Ollama que poden necessitar més temps de processament.", "settings.newTaskRequireTodos.description": "Requerir el paràmetre de tasques pendents quan es creïn noves tasques amb l'eina new_task", - "settings.codeIndex.embeddingBatchSize.description": "La mida del lot per a operacions d'incrustació durant la indexació de codi. Ajusta això segons els límits del teu proveïdor d'API. Per defecte és 60." + "settings.codeIndex.embeddingBatchSize.description": "La mida del lot per a operacions d'incrustació durant la indexació de codi. Ajusta això segons els límits del teu proveïdor d'API. Per defecte és 60.", + "settings.fontSizeMultiplier.description": "Multiplicador de mida de font per a la interfície de RooCode. Ajusta totes les mides de font proporcionalment (0.5-3.0, per defecte: 1.0)" } diff --git a/src/package.nls.de.json b/src/package.nls.de.json index d8043da94e..4db24ea82c 100644 --- a/src/package.nls.de.json +++ b/src/package.nls.de.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "Diesen Befehl Erklären", "command.acceptInput.title": "Eingabe/Vorschlag Akzeptieren", "command.toggleAutoApprove.title": "Auto-Genehmigung Umschalten", + "command.increaseFontSize.title": "Schriftgröße Erhöhen", + "command.decreaseFontSize.title": "Schriftgröße Verringern", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Aktiviert das Laden von AGENTS.md-Dateien für agentenspezifische Regeln (siehe https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Maximale Wartezeit in Sekunden auf API-Antworten (0 = kein Timeout, 1-3600s, Standard: 600s). Höhere Werte werden für lokale Anbieter wie LM Studio und Ollama empfohlen, die möglicherweise mehr Verarbeitungszeit benötigen.", "settings.newTaskRequireTodos.description": "Todos-Parameter beim Erstellen neuer Aufgaben mit dem new_task-Tool erfordern", - "settings.codeIndex.embeddingBatchSize.description": "Die Batch-Größe für Embedding-Operationen während der Code-Indexierung. Passe dies an die Limits deines API-Anbieters an. Standard ist 60." + "settings.codeIndex.embeddingBatchSize.description": "Die Batch-Größe für Embedding-Operationen während der Code-Indexierung. Passe dies an die Limits deines API-Anbieters an. Standard ist 60.", + "settings.fontSizeMultiplier.description": "Schriftgrößen-Multiplikator für die RooCode-Benutzeroberfläche. Passt alle Schriftgrößen proportional an (0.5-3.0, Standard: 1.0)" } diff --git a/src/package.nls.es.json b/src/package.nls.es.json index 000b353550..bc5a2ebb0d 100644 --- a/src/package.nls.es.json +++ b/src/package.nls.es.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "Explicar Este Comando", "command.acceptInput.title": "Aceptar Entrada/Sugerencia", "command.toggleAutoApprove.title": "Alternar Auto-Aprobación", + "command.increaseFontSize.title": "Aumentar Tamaño de Fuente", + "command.decreaseFontSize.title": "Disminuir Tamaño de Fuente", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Habilita la carga de archivos AGENTS.md para reglas específicas del agente (ver https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Tiempo máximo en segundos de espera para las respuestas de la API (0 = sin tiempo de espera, 1-3600s, por defecto: 600s). Se recomiendan valores más altos para proveedores locales como LM Studio y Ollama que puedan necesitar más tiempo de procesamiento.", "settings.newTaskRequireTodos.description": "Requerir el parámetro todos al crear nuevas tareas con la herramienta new_task", - "settings.codeIndex.embeddingBatchSize.description": "El tamaño del lote para operaciones de embedding durante la indexación de código. Ajusta esto según los límites de tu proveedor de API. Por defecto es 60." + "settings.codeIndex.embeddingBatchSize.description": "El tamaño del lote para operaciones de embedding durante la indexación de código. Ajusta esto según los límites de tu proveedor de API. Por defecto es 60.", + "settings.fontSizeMultiplier.description": "Multiplicador del tamaño de fuente para la interfaz de RooCode. Ajusta todos los tamaños de fuente proporcionalmente (0.5-3.0, por defecto: 1.0)" } diff --git a/src/package.nls.fr.json b/src/package.nls.fr.json index 0ba6ddeb8f..a105dd3a5f 100644 --- a/src/package.nls.fr.json +++ b/src/package.nls.fr.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "Expliquer cette Commande", "command.acceptInput.title": "Accepter l'Entrée/Suggestion", "command.toggleAutoApprove.title": "Basculer Auto-Approbation", + "command.increaseFontSize.title": "Augmenter la taille de police", + "command.decreaseFontSize.title": "Diminuer la taille de police", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Activer le chargement des fichiers AGENTS.md pour les règles spécifiques à l'agent (voir https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Temps maximum en secondes d'attente pour les réponses de l'API (0 = pas de timeout, 1-3600s, par défaut : 600s). Des valeurs plus élevées sont recommandées pour les fournisseurs locaux comme LM Studio et Ollama qui peuvent nécessiter plus de temps de traitement.", "settings.newTaskRequireTodos.description": "Exiger le paramètre todos lors de la création de nouvelles tâches avec l'outil new_task", - "settings.codeIndex.embeddingBatchSize.description": "La taille du lot pour les opérations d'embedding lors de l'indexation du code. Ajustez ceci selon les limites de votre fournisseur d'API. Par défaut, c'est 60." + "settings.codeIndex.embeddingBatchSize.description": "La taille du lot pour les opérations d'embedding lors de l'indexation du code. Ajustez ceci selon les limites de votre fournisseur d'API. Par défaut, c'est 60.", + "settings.fontSizeMultiplier.description": "Multiplicateur de taille de police pour l'interface RooCode. Ajuste toutes les tailles de police proportionnellement (0.5-3.0, par défaut : 1.0)" } diff --git a/src/package.nls.hi.json b/src/package.nls.hi.json index d4b4bb1cd0..ffb3e6e03f 100644 --- a/src/package.nls.hi.json +++ b/src/package.nls.hi.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "यह कमांड समझाएं", "command.acceptInput.title": "इनपुट/सुझाव स्वीकारें", "command.toggleAutoApprove.title": "ऑटो-अनुमोदन टॉगल करें", + "command.increaseFontSize.title": "फॉंट आकार बढ़ाएं", + "command.decreaseFontSize.title": "फॉंट आकार घटाएं", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "एजेंट-विशिष्ट नियमों के लिए AGENTS.md फ़ाइलों को लोड करना सक्षम करें (देखें https://agent-rules.org/)", "settings.apiRequestTimeout.description": "एपीआई प्रतिक्रियाओं की प्रतीक्षा करने के लिए सेकंड में अधिकतम समय (0 = कोई टाइमआउट नहीं, 1-3600s, डिफ़ॉल्ट: 600s)। एलएम स्टूडियो और ओलामा जैसे स्थानीय प्रदाताओं के लिए उच्च मानों की सिफारिश की जाती है जिन्हें अधिक प्रसंस्करण समय की आवश्यकता हो सकती है।", "settings.newTaskRequireTodos.description": "new_task टूल के साथ नए कार्य बनाते समय टूडू पैरामीटर की आवश्यकता होती है", - "settings.codeIndex.embeddingBatchSize.description": "कोड इंडेक्सिंग के दौरान एम्बेडिंग ऑपरेशन के लिए बैच साइज़। इसे अपने API प्रदाता की सीमाओं के अनुसार समायोजित करें। डिफ़ॉल्ट 60 है।" + "settings.codeIndex.embeddingBatchSize.description": "कोड इंडेक्सिंग के दौरान एम्बेडिंग ऑपरेशन के लिए बैच साइज़। इसे अपने API प्रदाता की सीमाओं के अनुसार समायोजित करें। डिफ़ॉल्ट 60 है।", + "settings.fontSizeMultiplier.description": "RooCode इंटरफेस के लिए फॉंट आकार गुणक। सभी फॉंट आकारों को समानुपातिक रूप से समायोजित करता है (0.5-3.0, डिफ़ॉल्ट: 1.0)" } diff --git a/src/package.nls.id.json b/src/package.nls.id.json index eb361a1ef7..7b4c6c4905 100644 --- a/src/package.nls.id.json +++ b/src/package.nls.id.json @@ -27,6 +27,8 @@ "command.terminal.explainCommand.title": "Jelaskan Perintah Ini", "command.acceptInput.title": "Terima Input/Saran", "command.toggleAutoApprove.title": "Alihkan Persetujuan Otomatis", + "command.increaseFontSize.title": "Perbesar Ukuran Font", + "command.decreaseFontSize.title": "Perkecil Ukuran Font", "configuration.title": "Roo Code", "commands.allowedCommands.description": "Perintah yang dapat dijalankan secara otomatis ketika 'Selalu setujui operasi eksekusi' diaktifkan", "commands.deniedCommands.description": "Awalan perintah yang akan otomatis ditolak tanpa meminta persetujuan. Jika terjadi konflik dengan perintah yang diizinkan, pencocokan awalan terpanjang akan diprioritaskan. Tambahkan * untuk menolak semua perintah.", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Aktifkan pemuatan file AGENTS.md untuk aturan khusus agen (lihat https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Waktu maksimum dalam detik untuk menunggu respons API (0 = tidak ada batas waktu, 1-3600s, default: 600s). Nilai yang lebih tinggi disarankan untuk penyedia lokal seperti LM Studio dan Ollama yang mungkin memerlukan lebih banyak waktu pemrosesan.", "settings.newTaskRequireTodos.description": "Memerlukan parameter todos saat membuat tugas baru dengan alat new_task", - "settings.codeIndex.embeddingBatchSize.description": "Ukuran batch untuk operasi embedding selama pengindeksan kode. Sesuaikan ini berdasarkan batas penyedia API kamu. Default adalah 60." + "settings.codeIndex.embeddingBatchSize.description": "Ukuran batch untuk operasi embedding selama pengindeksan kode. Sesuaikan ini berdasarkan batas penyedia API kamu. Default adalah 60.", + "settings.fontSizeMultiplier.description": "Pengali ukuran font untuk antarmuka RooCode. Menyesuaikan semua ukuran font secara proporsional (0.5-3.0, default: 1.0)" } diff --git a/src/package.nls.it.json b/src/package.nls.it.json index 78989df6fe..c6eb347d6f 100644 --- a/src/package.nls.it.json +++ b/src/package.nls.it.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "Spiega Questo Comando", "command.acceptInput.title": "Accetta Input/Suggerimento", "command.toggleAutoApprove.title": "Attiva/Disattiva Auto-Approvazione", + "command.increaseFontSize.title": "Aumenta Dimensione Font", + "command.decreaseFontSize.title": "Diminuisci Dimensione Font", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Abilita il caricamento dei file AGENTS.md per regole specifiche dell'agente (vedi https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Tempo massimo in secondi di attesa per le risposte API (0 = nessun timeout, 1-3600s, predefinito: 600s). Valori più alti sono consigliati per provider locali come LM Studio e Ollama che potrebbero richiedere più tempo di elaborazione.", "settings.newTaskRequireTodos.description": "Richiedere il parametro todos quando si creano nuove attività con lo strumento new_task", - "settings.codeIndex.embeddingBatchSize.description": "La dimensione del batch per le operazioni di embedding durante l'indicizzazione del codice. Regola questo in base ai limiti del tuo provider API. Il valore predefinito è 60." + "settings.codeIndex.embeddingBatchSize.description": "La dimensione del batch per le operazioni di embedding durante l'indicizzazione del codice. Regola questo in base ai limiti del tuo provider API. Il valore predefinito è 60.", + "settings.fontSizeMultiplier.description": "Moltiplicatore della dimensione del font per l'interfaccia RooCode. Regola tutte le dimensioni dei font proporzionalmente (0.5-3.0, predefinito: 1.0)" } diff --git a/src/package.nls.ja.json b/src/package.nls.ja.json index 3eb059cbd9..0dc047cdb2 100644 --- a/src/package.nls.ja.json +++ b/src/package.nls.ja.json @@ -27,6 +27,8 @@ "command.terminal.explainCommand.title": "このコマンドを説明", "command.acceptInput.title": "入力/提案を承認", "command.toggleAutoApprove.title": "自動承認を切替", + "command.increaseFontSize.title": "フォントサイズを大きく", + "command.decreaseFontSize.title": "フォントサイズを小さく", "configuration.title": "Roo Code", "commands.allowedCommands.description": "'常に実行操作を承認する'が有効な場合に自動実行できるコマンド", "commands.deniedCommands.description": "承認を求めずに自動的に拒否されるコマンドプレフィックス。許可されたコマンドとの競合がある場合、最長プレフィックスマッチが優先されます。すべてのコマンドを拒否するには * を追加してください。", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "エージェント固有のルールのためにAGENTS.mdファイルの読み込みを有効にします（参照：https://agent-rules.org/）", "settings.apiRequestTimeout.description": "API応答を待機する最大時間（秒）（0 = タイムアウトなし、1-3600秒、デフォルト: 600秒）。LM StudioやOllamaのような、より多くの処理時間を必要とする可能性のあるローカルプロバイダーには、より高い値が推奨されます。", "settings.newTaskRequireTodos.description": "new_taskツールで新しいタスクを作成する際にtodosパラメータを必須にする", - "settings.codeIndex.embeddingBatchSize.description": "コードインデックス作成中のエンベディング操作のバッチサイズ。APIプロバイダーの制限に基づいてこれを調整してください。デフォルトは60です。" + "settings.codeIndex.embeddingBatchSize.description": "コードインデックス作成中のエンベディング操作のバッチサイズ。APIプロバイダーの制限に基づいてこれを調整してください。デフォルトは60です。", + "settings.fontSizeMultiplier.description": "RooCodeインターフェースのフォントサイズ乗数。すべてのフォントサイズを比例的に調整します（0.5-3.0、デフォルト：1.0）" } diff --git a/src/package.nls.json b/src/package.nls.json index 1db69777ac..7efe008be0 100644 --- a/src/package.nls.json +++ b/src/package.nls.json @@ -27,6 +27,8 @@ "command.terminal.explainCommand.title": "Explain This Command", "command.acceptInput.title": "Accept Input/Suggestion", "command.toggleAutoApprove.title": "Toggle Auto-Approve", + "command.increaseFontSize.title": "Increase Font Size", + "command.decreaseFontSize.title": "Decrease Font Size", "configuration.title": "Roo Code", "commands.allowedCommands.description": "Commands that can be auto-executed when 'Always approve execute operations' is enabled", "commands.deniedCommands.description": "Command prefixes that will be automatically denied without asking for approval. In case of conflicts with allowed commands, the longest prefix match takes precedence. Add * to deny all commands.", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Enable loading of AGENTS.md files for agent-specific rules (see https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Maximum time in seconds to wait for API responses (0 = no timeout, 1-3600s, default: 600s). Higher values are recommended for local providers like LM Studio and Ollama that may need more processing time.", "settings.newTaskRequireTodos.description": "Require todos parameter when creating new tasks with the new_task tool", - "settings.codeIndex.embeddingBatchSize.description": "The batch size for embedding operations during code indexing. Adjust this based on your API provider's limits. Default is 60." + "settings.codeIndex.embeddingBatchSize.description": "The batch size for embedding operations during code indexing. Adjust this based on your API provider's limits. Default is 60.", + "settings.fontSizeMultiplier.description": "Font size multiplier for the RooCode interface. Adjusts all font sizes proportionally (0.5-3.0, default: 1.0)" } diff --git a/src/package.nls.ko.json b/src/package.nls.ko.json index a566b2a038..da19c95249 100644 --- a/src/package.nls.ko.json +++ b/src/package.nls.ko.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "이 명령어 설명", "command.acceptInput.title": "입력/제안 수락", "command.toggleAutoApprove.title": "자동 승인 전환", + "command.increaseFontSize.title": "글꼴 크기 늘리기", + "command.decreaseFontSize.title": "글꼴 크기 줄이기", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "에이전트별 규칙에 대한 AGENTS.md 파일 로드를 활성화합니다 (참조: https://agent-rules.org/)", "settings.apiRequestTimeout.description": "API 응답을 기다리는 최대 시간(초) (0 = 시간 초과 없음, 1-3600초, 기본값: 600초). 더 많은 처리 시간이 필요할 수 있는 LM Studio 및 Ollama와 같은 로컬 공급자에게는 더 높은 값을 사용하는 것이 좋습니다.", "settings.newTaskRequireTodos.description": "new_task 도구로 새 작업을 생성할 때 todos 매개변수 필요", - "settings.codeIndex.embeddingBatchSize.description": "코드 인덱싱 중 임베딩 작업의 배치 크기입니다. API 공급자의 제한에 따라 이를 조정하세요. 기본값은 60입니다." + "settings.codeIndex.embeddingBatchSize.description": "코드 인덱싱 중 임베딩 작업의 배치 크기입니다. API 공급자의 제한에 따라 이를 조정하세요. 기본값은 60입니다.", + "settings.fontSizeMultiplier.description": "RooCode 인터페이스의 글꼴 크기 배율입니다. 모든 글꼴 크기를 비례적으로 조정합니다 (0.5-3.0, 기본값: 1.0)" } diff --git a/src/package.nls.nl.json b/src/package.nls.nl.json index 006725326b..11d01cf97c 100644 --- a/src/package.nls.nl.json +++ b/src/package.nls.nl.json @@ -27,6 +27,8 @@ "command.terminal.explainCommand.title": "Leg Dit Commando Uit", "command.acceptInput.title": "Invoer/Suggestie Accepteren", "command.toggleAutoApprove.title": "Auto-Goedkeuring Schakelen", + "command.increaseFontSize.title": "Lettergrootte Vergroten", + "command.decreaseFontSize.title": "Lettergrootte Verkleinen", "configuration.title": "Roo Code", "commands.allowedCommands.description": "Commando's die automatisch kunnen worden uitgevoerd wanneer 'Altijd goedkeuren uitvoerbewerkingen' is ingeschakeld", "commands.deniedCommands.description": "Commando-prefixen die automatisch worden geweigerd zonder om goedkeuring te vragen. Bij conflicten met toegestane commando's heeft de langste prefix-match voorrang. Voeg * toe om alle commando's te weigeren.", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Laden van AGENTS.md-bestanden voor agentspecifieke regels inschakelen (zie https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Maximale tijd in seconden om te wachten op API-reacties (0 = geen time-out, 1-3600s, standaard: 600s). Hogere waarden worden aanbevolen voor lokale providers zoals LM Studio en Ollama die mogelijk meer verwerkingstijd nodig hebben.", "settings.newTaskRequireTodos.description": "Todos-parameter vereisen bij het maken van nieuwe taken met de new_task tool", - "settings.codeIndex.embeddingBatchSize.description": "De batchgrootte voor embedding-operaties tijdens code-indexering. Pas dit aan op basis van de limieten van je API-provider. Standaard is 60." + "settings.codeIndex.embeddingBatchSize.description": "De batchgrootte voor embedding-operaties tijdens code-indexering. Pas dit aan op basis van de limieten van je API-provider. Standaard is 60.", + "settings.fontSizeMultiplier.description": "Lettergrootte-vermenigvuldiger voor de RooCode-interface. Past alle lettergroottes proportioneel aan (0.5-3.0, standaard: 1.0)" } diff --git a/src/package.nls.pl.json b/src/package.nls.pl.json index bcf80f7230..80e99ebf6e 100644 --- a/src/package.nls.pl.json +++ b/src/package.nls.pl.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "Wyjaśnij tę Komendę", "command.acceptInput.title": "Akceptuj Wprowadzanie/Sugestię", "command.toggleAutoApprove.title": "Przełącz Auto-Zatwierdzanie", + "command.increaseFontSize.title": "Zwiększ Rozmiar Czcionki", + "command.decreaseFontSize.title": "Zmniejsz Rozmiar Czcionki", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Włącz wczytywanie plików AGENTS.md dla reguł specyficznych dla agenta (zobacz https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Maksymalny czas w sekundach oczekiwania na odpowiedzi API (0 = brak limitu czasu, 1-3600s, domyślnie: 600s). Wyższe wartości są zalecane dla lokalnych dostawców, takich jak LM Studio i Ollama, którzy mogą potrzebować więcej czasu na przetwarzanie.", "settings.newTaskRequireTodos.description": "Wymagaj parametru todos podczas tworzenia nowych zadań za pomocą narzędzia new_task", - "settings.codeIndex.embeddingBatchSize.description": "Rozmiar partii dla operacji osadzania podczas indeksowania kodu. Dostosuj to w oparciu o limity twojego dostawcy API. Domyślnie to 60." + "settings.codeIndex.embeddingBatchSize.description": "Rozmiar partii dla operacji osadzania podczas indeksowania kodu. Dostosuj to w oparciu o limity twojego dostawcy API. Domyślnie to 60.", + "settings.fontSizeMultiplier.description": "Mnożnik rozmiaru czcionki dla interfejsu RooCode. Dostosowuje wszystkie rozmiary czcionek proporcjonalnie (0.5-3.0, domyślnie: 1.0)" } diff --git a/src/package.nls.pt-BR.json b/src/package.nls.pt-BR.json index 1843bc476b..1ecc4fa3c6 100644 --- a/src/package.nls.pt-BR.json +++ b/src/package.nls.pt-BR.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "Explicar Este Comando", "command.acceptInput.title": "Aceitar Entrada/Sugestão", "command.toggleAutoApprove.title": "Alternar Auto-Aprovação", + "command.increaseFontSize.title": "Aumentar Tamanho da Fonte", + "command.decreaseFontSize.title": "Diminuir Tamanho da Fonte", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Habilita o carregamento de arquivos AGENTS.md para regras específicas do agente (consulte https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Tempo máximo em segundos de espera pelas respostas da API (0 = sem tempo limite, 1-3600s, padrão: 600s). Valores mais altos são recomendados para provedores locais como LM Studio e Ollama que podem precisar de mais tempo de processamento.", "settings.newTaskRequireTodos.description": "Exigir parâmetro todos ao criar novas tarefas com a ferramenta new_task", - "settings.codeIndex.embeddingBatchSize.description": "O tamanho do lote para operações de embedding durante a indexação de código. Ajuste isso com base nos limites do seu provedor de API. O padrão é 60." + "settings.codeIndex.embeddingBatchSize.description": "O tamanho do lote para operações de embedding durante a indexação de código. Ajuste isso com base nos limites do seu provedor de API. O padrão é 60.", + "settings.fontSizeMultiplier.description": "Multiplicador do tamanho da fonte para a interface RooCode. Ajusta todos os tamanhos de fonte proporcionalmente (0.5-3.0, padrão: 1.0)" } diff --git a/src/package.nls.ru.json b/src/package.nls.ru.json index 8a50af7389..78a564b83c 100644 --- a/src/package.nls.ru.json +++ b/src/package.nls.ru.json @@ -27,6 +27,8 @@ "command.terminal.explainCommand.title": "Объяснить эту команду", "command.acceptInput.title": "Принять ввод/предложение", "command.toggleAutoApprove.title": "Переключить Авто-Подтверждение", + "command.increaseFontSize.title": "Увеличить Размер Шрифта", + "command.decreaseFontSize.title": "Уменьшить Размер Шрифта", "configuration.title": "Roo Code", "commands.allowedCommands.description": "Команды, которые могут быть автоматически выполнены, когда включена опция 'Всегда подтверждать операции выполнения'", "commands.deniedCommands.description": "Префиксы команд, которые будут автоматически отклонены без запроса подтверждения. В случае конфликтов с разрешенными командами приоритет имеет самое длинное совпадение префикса. Добавьте * чтобы отклонить все команды.", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Включить загрузку файлов AGENTS.md для специфичных для агента правил (см. https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Максимальное время в секундах для ожидания ответов API (0 = нет тайм-аута, 1-3600 с, по умолчанию: 600 с). Рекомендуются более высокие значения для локальных провайдеров, таких как LM Studio и Ollama, которым может потребоваться больше времени на обработку.", "settings.newTaskRequireTodos.description": "Требовать параметр todos при создании новых задач с помощью инструмента new_task", - "settings.codeIndex.embeddingBatchSize.description": "Размер пакета для операций встраивания во время индексации кода. Настройте это в соответствии с ограничениями вашего API-провайдера. По умолчанию 60." + "settings.codeIndex.embeddingBatchSize.description": "Размер пакета для операций встраивания во время индексации кода. Настройте это в соответствии с ограничениями вашего API-провайдера. По умолчанию 60.", + "settings.fontSizeMultiplier.description": "Множитель размера шрифта для интерфейса RooCode. Настраивает все размеры шрифтов пропорционально (0.5-3.0, по умолчанию: 1.0)" } diff --git a/src/package.nls.tr.json b/src/package.nls.tr.json index 4eec2c70a0..27bafc5d98 100644 --- a/src/package.nls.tr.json +++ b/src/package.nls.tr.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "Bu Komutu Açıkla", "command.acceptInput.title": "Girişi/Öneriyi Kabul Et", "command.toggleAutoApprove.title": "Otomatik Onayı Değiştir", + "command.increaseFontSize.title": "Yazı Tipi Boyutunu Artır", + "command.decreaseFontSize.title": "Yazı Tipi Boyutunu Azalt", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Aracıya özgü kurallar için AGENTS.md dosyalarının yüklenmesini etkinleştirin (bkz. https://agent-rules.org/)", "settings.apiRequestTimeout.description": "API yanıtları için beklenecek maksimum süre (saniye cinsinden) (0 = zaman aşımı yok, 1-3600s, varsayılan: 600s). LM Studio ve Ollama gibi daha fazla işlem süresi gerektirebilecek yerel sağlayıcılar için daha yüksek değerler önerilir.", "settings.newTaskRequireTodos.description": "new_task aracıyla yeni görevler oluştururken todos parametresini gerekli kıl", - "settings.codeIndex.embeddingBatchSize.description": "Kod indeksleme sırasında gömme işlemleri için toplu iş boyutu. Bunu API sağlayıcınızın sınırlarına göre ayarlayın. Varsayılan 60'tır." + "settings.codeIndex.embeddingBatchSize.description": "Kod indeksleme sırasında gömme işlemleri için toplu iş boyutu. Bunu API sağlayıcınızın sınırlarına göre ayarlayın. Varsayılan 60'tır.", + "settings.fontSizeMultiplier.description": "RooCode arayüzü için yazı tipi boyutu çarpanı. Tüm yazı tipi boyutlarını orantılı olarak ayarlar (0.5-3.0, varsayılan: 1.0)" } diff --git a/src/package.nls.vi.json b/src/package.nls.vi.json index a0c9614dd2..1c94487368 100644 --- a/src/package.nls.vi.json +++ b/src/package.nls.vi.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "Giải Thích Lệnh Này", "command.acceptInput.title": "Chấp Nhận Đầu Vào/Gợi Ý", "command.toggleAutoApprove.title": "Bật/Tắt Tự Động Phê Duyệt", + "command.increaseFontSize.title": "Tăng Kích Thước Phông Chữ", + "command.decreaseFontSize.title": "Giảm Kích Thước Phông Chữ", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "Bật tải tệp AGENTS.md cho các quy tắc dành riêng cho tác nhân (xem https://agent-rules.org/)", "settings.apiRequestTimeout.description": "Thời gian tối đa tính bằng giây để đợi phản hồi API (0 = không có thời gian chờ, 1-3600 giây, mặc định: 600 giây). Nên sử dụng các giá trị cao hơn cho các nhà cung cấp cục bộ như LM Studio và Ollama có thể cần thêm thời gian xử lý.", "settings.newTaskRequireTodos.description": "Yêu cầu tham số todos khi tạo nhiệm vụ mới với công cụ new_task", - "settings.codeIndex.embeddingBatchSize.description": "Kích thước lô cho các hoạt động nhúng trong quá trình lập chỉ mục mã. Điều chỉnh điều này dựa trên giới hạn của nhà cung cấp API của bạn. Mặc định là 60." + "settings.codeIndex.embeddingBatchSize.description": "Kích thước lô cho các hoạt động nhúng trong quá trình lập chỉ mục mã. Điều chỉnh điều này dựa trên giới hạn của nhà cung cấp API của bạn. Mặc định là 60.", + "settings.fontSizeMultiplier.description": "Hệ số nhân kích thước phông chữ cho giao diện RooCode. Điều chỉnh tất cả các kích thước phông chữ một cách tỷ lệ (0.5-3.0, mặc định: 1.0)" } diff --git a/src/package.nls.zh-CN.json b/src/package.nls.zh-CN.json index caab1a633d..2d631c4171 100644 --- a/src/package.nls.zh-CN.json +++ b/src/package.nls.zh-CN.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "解释此命令", "command.acceptInput.title": "接受输入/建议", "command.toggleAutoApprove.title": "切换自动批准", + "command.increaseFontSize.title": "增大字体大小", + "command.decreaseFontSize.title": "减小字体大小", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "为特定于代理的规则启用 AGENTS.md 文件的加载（请参阅 https://agent-rules.org/）", "settings.apiRequestTimeout.description": "等待 API 响应的最长时间（秒）（0 = 无超时，1-3600秒，默认值：600秒）。对于像 LM Studio 和 Ollama 这样可能需要更多处理时间的本地提供商，建议使用更高的值。", "settings.newTaskRequireTodos.description": "使用 new_task 工具创建新任务时需要 todos 参数", - "settings.codeIndex.embeddingBatchSize.description": "代码索引期间嵌入操作的批处理大小。根据 API 提供商的限制调整此设置。默认值为 60。" + "settings.codeIndex.embeddingBatchSize.description": "代码索引期间嵌入操作的批处理大小。根据 API 提供商的限制调整此设置。默认值为 60。", + "settings.fontSizeMultiplier.description": "RooCode 界面的字体大小倍数。按比例调整所有字体大小（0.5-3.0，默认值：1.0）" } diff --git a/src/package.nls.zh-TW.json b/src/package.nls.zh-TW.json index 8ad1011bb4..cd9fb907e0 100644 --- a/src/package.nls.zh-TW.json +++ b/src/package.nls.zh-TW.json @@ -15,6 +15,8 @@ "command.terminal.explainCommand.title": "解釋此命令", "command.acceptInput.title": "接受輸入/建議", "command.toggleAutoApprove.title": "切換自動批准", + "command.increaseFontSize.title": "增大字體大小", + "command.decreaseFontSize.title": "減小字體大小", "views.activitybar.title": "Roo Code", "views.contextMenu.label": "Roo Code", "views.terminalMenu.label": "Roo Code", @@ -42,5 +44,6 @@ "settings.useAgentRules.description": "為特定於代理的規則啟用 AGENTS.md 檔案的載入（請參閱 https://agent-rules.org/）", "settings.apiRequestTimeout.description": "等待 API 回應的最長時間（秒）（0 = 無超時，1-3600秒，預設值：600秒）。對於像 LM Studio 和 Ollama 這樣可能需要更多處理時間的本地提供商，建議使用更高的值。", "settings.newTaskRequireTodos.description": "使用 new_task 工具建立新工作時需要 todos 參數", - "settings.codeIndex.embeddingBatchSize.description": "程式碼索引期間嵌入操作的批次大小。根據 API 提供商的限制調整此設定。預設值為 60。" + "settings.codeIndex.embeddingBatchSize.description": "程式碼索引期間嵌入操作的批次大小。根據 API 提供商的限制調整此設定。預設值為 60。", + "settings.fontSizeMultiplier.description": "RooCode 介面的字體大小倍數。按比例調整所有字體大小（0.5-3.0，預設值：1.0）" } diff --git a/src/shared/ExtensionMessage.ts b/src/shared/ExtensionMessage.ts index 66f389f81c..2d995fd2ea 100644 --- a/src/shared/ExtensionMessage.ts +++ b/src/shared/ExtensionMessage.ts @@ -140,6 +140,7 @@ export interface ExtensionMessage { | "focusInput" | "switchTab" | "toggleAutoApprove" + | "fontSizeChanged" invoke?: "newChat" | "sendMessage" | "primaryButtonClick" | "secondaryButtonClick" | "setChatBoxMessage" state?: ExtensionState images?: string[] @@ -205,6 +206,7 @@ export interface ExtensionMessage { queuedMessages?: QueuedMessage[] list?: string[] // For dismissedUpsells organizationId?: string | null // For organizationSwitchResult + fontSizeMultiplier?: number // For fontSizeChanged action } export type ExtensionState = Pick< @@ -353,6 +355,7 @@ export type ExtensionState = Pick< remoteControlEnabled: boolean taskSyncEnabled: boolean featureRoomoteControlEnabled: boolean + fontSizeMultiplier: number } export interface ClineSayTool { diff --git a/webview-ui/src/App.tsx b/webview-ui/src/App.tsx index 220c8cf3af..73a93ad7b7 100644 --- a/webview-ui/src/App.tsx +++ b/webview-ui/src/App.tsx @@ -79,6 +79,7 @@ const App = () => { cloudOrganizations, renderContext, mdmCompliant, + fontSizeMultiplier, } = useExtensionState() // Create a persistent state manager @@ -140,6 +141,15 @@ const App = () => { const message: ExtensionMessage = e.data if (message.type === "action" && message.action) { + // Handle fontSizeChanged action + if (message.action === "fontSizeChanged" && message.fontSizeMultiplier !== undefined) { + document.documentElement.style.setProperty( + "--roo-font-size-multiplier", + message.fontSizeMultiplier.toString(), + ) + return + } + // Handle switchTab action with tab parameter if (message.action === "switchTab" && message.tab) { const targetTab = message.tab as Tab @@ -224,6 +234,13 @@ const App = () => { console.debug("App initialized with source map support") }, []) + // Initialize font size multiplier when the component mounts or when it changes + useEffect(() => { + if (fontSizeMultiplier !== undefined) { + document.documentElement.style.setProperty("--roo-font-size-multiplier", fontSizeMultiplier.toString()) + } + }, [fontSizeMultiplier]) + // Focus the WebView when non-interactive content is clicked (only in editor/tab mode) useAddNonInteractiveClickListener( useCallback(() => { diff --git a/webview-ui/src/components/chat/BrowserSessionRow.tsx b/webview-ui/src/components/chat/BrowserSessionRow.tsx index c23b79f568..53cf466aa8 100644 --- a/webview-ui/src/components/chat/BrowserSessionRow.tsx +++ b/webview-ui/src/components/chat/BrowserSessionRow.tsx @@ -262,7 +262,7 @@ const BrowserSessionRow = memo((props: BrowserSessionRowProps) => { alignItems: "center", justifyContent: "center", color: "var(--vscode-descriptionForeground)", - fontSize: "12px", + fontSize: "calc(12px * var(--roo-font-size-multiplier, 1))", }}>
{ }}>
)} diff --git a/webview-ui/src/components/chat/ChatRow.tsx b/webview-ui/src/components/chat/ChatRow.tsx index 26bc71074a..58aaffabd7 100644 --- a/webview-ui/src/components/chat/ChatRow.tsx +++ b/webview-ui/src/components/chat/ChatRow.tsx @@ -277,7 +277,11 @@ export const ChatRowContent = ({ }}> ) @@ -821,7 +825,7 @@ export const ChatRowContent = ({ backgroundColor: "var(--vscode-badge-background)", borderBottom: "1px solid var(--vscode-editorGroup-border)", fontWeight: "bold", - fontSize: "var(--vscode-font-size)", + fontSize: "calc(var(--vscode-font-size) * var(--roo-font-size-multiplier, 1))", color: "var(--vscode-badge-foreground)", display: "flex", alignItems: "center", @@ -858,7 +862,7 @@ export const ChatRowContent = ({ backgroundColor: "var(--vscode-badge-background)", borderBottom: "1px solid var(--vscode-editorGroup-border)", fontWeight: "bold", - fontSize: "var(--vscode-font-size)", + fontSize: "calc(var(--vscode-font-size) * var(--roo-font-size-multiplier, 1))", color: "var(--vscode-badge-foreground)", display: "flex", alignItems: "center", @@ -904,11 +908,20 @@ export const ChatRowContent = ({ padding: "10px 12px", }}>
- + /{slashCommandInfo.command} {slashCommandInfo.source && ( - + {slashCommandInfo.source} )} @@ -1014,7 +1027,7 @@ export const ChatRowContent = ({ backgroundColor: "var(--vscode-badge-background)", borderBottom: "1px solid var(--vscode-editorGroup-border)", fontWeight: "bold", - fontSize: "var(--vscode-font-size)", + fontSize: "calc(var(--vscode-font-size) * var(--roo-font-size-multiplier, 1))", color: "var(--vscode-badge-foreground)", display: "flex", alignItems: "center", @@ -1326,7 +1339,8 @@ export const ChatRowContent = ({ /{slashCommandInfo.command} @@ -1334,7 +1348,8 @@ export const ChatRowContent = ({ {slashCommandInfo.args} @@ -1344,7 +1359,8 @@ export const ChatRowContent = ({
{slashCommandInfo.description}
@@ -1352,7 +1368,10 @@ export const ChatRowContent = ({ {slashCommandInfo.source && (
+ style={{ + fontSize: + "calc((var(--vscode-font-size) - 2px) * var(--roo-font-size-multiplier, 1))", + }}> {slashCommandInfo.source}
diff --git a/webview-ui/src/components/chat/ChatView.tsx b/webview-ui/src/components/chat/ChatView.tsx index d358c68f1c..be6ad9018c 100644 --- a/webview-ui/src/components/chat/ChatView.tsx +++ b/webview-ui/src/components/chat/ChatView.tsx @@ -3,7 +3,7 @@ import { useDeepCompareEffect, useEvent, useMount } from "react-use" import debounce from "debounce" import { Virtuoso, type VirtuosoHandle } from "react-virtuoso" import removeMd from "remove-markdown" -import { VSCodeButton, VSCodeLink } from "@vscode/webview-ui-toolkit/react" +import { VSCodeLink } from "@vscode/webview-ui-toolkit/react" import useSound from "use-sound" import { LRUCache } from "lru-cache" import { Trans, useTranslation } from "react-i18next" @@ -37,7 +37,7 @@ import { useExtensionState } from "@src/context/ExtensionStateContext" import { useSelectedModel } from "@src/components/ui/hooks/useSelectedModel" import RooHero from "@src/components/welcome/RooHero" import RooTips from "@src/components/welcome/RooTips" -import { StandardTooltip } from "@src/components/ui" +import { Button, StandardTooltip } from "@src/components/ui" import { useAutoApprovalState } from "@src/hooks/useAutoApprovalState" import { useAutoApprovalToggles } from "@src/hooks/useAutoApprovalToggles" import { CloudUpsellDialog } from "@src/components/cloud/CloudUpsellDialog" @@ -1900,15 +1900,15 @@ const ChatViewComponent: React.ForwardRefRenderFunction {showScrollToBottom ? ( - { scrollToBottomSmooth() disableAutoScrollRef.current = false }}> - + ) : ( <> @@ -1935,13 +1935,13 @@ const ChatViewComponent: React.ForwardRefRenderFunction - handlePrimaryButtonClick(inputValue, selectedImages)}> {primaryButtonText} - + )} {(secondaryButtonText || isStreaming) && ( @@ -1957,13 +1957,13 @@ const ChatViewComponent: React.ForwardRefRenderFunction - handleSecondaryButtonClick(inputValue, selectedImages)}> {isStreaming ? t("chat:cancel.title") : secondaryButtonText} - + )} diff --git a/webview-ui/src/components/chat/CodeIndexPopover.tsx b/webview-ui/src/components/chat/CodeIndexPopover.tsx index 45bf4224a1..50ed3b4ee6 100644 --- a/webview-ui/src/components/chat/CodeIndexPopover.tsx +++ b/webview-ui/src/components/chat/CodeIndexPopover.tsx @@ -7,8 +7,8 @@ import { VSCodeDropdown, VSCodeOption, VSCodeLink, - VSCodeCheckbox, } from "@vscode/webview-ui-toolkit/react" +import { Checkbox } from "@/components/ui/checkbox" import * as ProgressPrimitive from "@radix-ui/react-progress" import { AlertTriangle } from "lucide-react" @@ -577,11 +577,13 @@ export const CodeIndexPopover: React.FC = ({ {/* Enable/Disable Toggle */}
- updateSetting("codebaseIndexEnabled", e.target.checked)}> - {t("settings:codeIndex.enableLabel")} - + onCheckedChange={(checked) => + updateSetting("codebaseIndexEnabled", checked === true) + } + /> + {t("settings:codeIndex.enableLabel")} diff --git a/webview-ui/src/components/chat/ContextCondenseRow.tsx b/webview-ui/src/components/chat/ContextCondenseRow.tsx index c2fdba802d..2e47a39ba8 100644 --- a/webview-ui/src/components/chat/ContextCondenseRow.tsx +++ b/webview-ui/src/components/chat/ContextCondenseRow.tsx @@ -31,7 +31,11 @@ export const ContextCondenseRow = ({ cost, prevContextTokens, newContextTokens, }}>
diff --git a/webview-ui/src/components/chat/ContextMenu.tsx b/webview-ui/src/components/chat/ContextMenu.tsx index cf4b10a981..1317bd8d32 100644 --- a/webview-ui/src/components/chat/ContextMenu.tsx +++ b/webview-ui/src/components/chat/ContextMenu.tsx @@ -402,7 +402,7 @@ const ContextMenu: React.FC = ({ style={{ marginRight: "6px", flexShrink: 0, - fontSize: "14px", + fontSize: "calc(14px * var(--roo-font-size-multiplier, 1))", marginTop: 0, }} /> @@ -415,7 +415,11 @@ const ContextMenu: React.FC = ({ !option.value && ( )}
diff --git a/webview-ui/src/components/chat/FollowUpSuggest.tsx b/webview-ui/src/components/chat/FollowUpSuggest.tsx index d18ccc2517..858f7c048d 100644 --- a/webview-ui/src/components/chat/FollowUpSuggest.tsx +++ b/webview-ui/src/components/chat/FollowUpSuggest.tsx @@ -127,7 +127,10 @@ export const FollowUpSuggest = ({ {suggestion.mode && (
- + {suggestion.mode}
)} diff --git a/webview-ui/src/components/chat/IconButton.tsx b/webview-ui/src/components/chat/IconButton.tsx index 00210ac5b3..bca53a84fd 100644 --- a/webview-ui/src/components/chat/IconButton.tsx +++ b/webview-ui/src/components/chat/IconButton.tsx @@ -40,7 +40,7 @@ export const IconButton: React.FC = ({ )} disabled={disabled} onClick={!disabled ? onClick : undefined} - style={{ fontSize: 16.5, ...style }} + style={{ fontSize: "calc(16.5px * var(--roo-font-size-multiplier, 1))", ...style }} {...props}> diff --git a/webview-ui/src/components/chat/TodoListDisplay.tsx b/webview-ui/src/components/chat/TodoListDisplay.tsx index c9a4d8f4d0..daccf316e9 100644 --- a/webview-ui/src/components/chat/TodoListDisplay.tsx +++ b/webview-ui/src/components/chat/TodoListDisplay.tsx @@ -65,7 +65,7 @@ export function TodoListDisplay({ todos }: { todos: any[] }) { marginRight: 8, marginLeft: 2, flexShrink: 0, - fontSize: 14, + fontSize: "calc(14px * var(--roo-font-size-multiplier, 1))", }} /> ) @@ -163,13 +163,13 @@ export function TodoListDisplay({ todos }: { todos: any[] }) { className="codicon codicon-checklist" style={{ color: "var(--vscode-descriptionForeground)", - fontSize: 12, + fontSize: "calc(12px * var(--roo-font-size-multiplier, 1))", }} /> {completedCount}/{totalCount} @@ -224,11 +224,17 @@ export function TodoListDisplay({ todos }: { todos: any[] }) { className="codicon codicon-checklist" style={{ color: "var(--vscode-foreground)" }} /> - Todo List + + Todo List + {completedCount}/{totalCount} @@ -237,7 +243,7 @@ export function TodoListDisplay({ todos }: { todos: any[] }) { { e.stopPropagation() onJumpToFile() diff --git a/webview-ui/src/components/common/CodeBlock.tsx b/webview-ui/src/components/common/CodeBlock.tsx index b13a6ec24d..55d1b6f2c9 100644 --- a/webview-ui/src/components/common/CodeBlock.tsx +++ b/webview-ui/src/components/common/CodeBlock.tsx @@ -142,7 +142,7 @@ export const StyledPre = styled.div<{ white-space: ${({ wordwrap }) => (wordwrap === "false" ? "pre" : "pre-wrap")}; word-break: ${({ wordwrap }) => (wordwrap === "false" ? "normal" : "normal")}; overflow-wrap: ${({ wordwrap }) => (wordwrap === "false" ? "normal" : "break-word")}; - font-size: 0.95em; + font-size: calc(0.95em * var(--roo-font-size-multiplier, 1)); font-family: var(--vscode-editor-font-family); } diff --git a/webview-ui/src/components/common/MarkdownBlock.tsx b/webview-ui/src/components/common/MarkdownBlock.tsx index 47c61a5ce0..6b9dbfe53d 100644 --- a/webview-ui/src/components/common/MarkdownBlock.tsx +++ b/webview-ui/src/components/common/MarkdownBlock.tsx @@ -26,7 +26,7 @@ const StyledMarkdown = styled.div` code:not(pre > code) { font-family: var(--vscode-editor-font-family, monospace); - font-size: 0.85em; + font-size: calc(0.85em * var(--roo-font-size-multiplier, 1)); filter: saturation(110%) brightness(95%); color: var(--vscode-textPreformat-foreground) !important; background-color: var(--vscode-textPreformat-background) !important; @@ -46,7 +46,7 @@ const StyledMarkdown = styled.div` /* KaTeX styling */ .katex { - font-size: 1.1em; + font-size: calc(1.1em * var(--roo-font-size-multiplier, 1)); color: var(--vscode-editor-foreground); font-family: KaTeX_Main, "Times New Roman", serif; line-height: 1.2; @@ -83,7 +83,7 @@ const StyledMarkdown = styled.div` "Helvetica Neue", sans-serif; - font-size: var(--vscode-font-size, 13px); + font-size: calc(var(--vscode-font-size, 13px) * var(--roo-font-size-multiplier, 1)); p, li, @@ -147,19 +147,19 @@ const StyledMarkdown = styled.div` } h1 { - font-size: 1.65em; + font-size: calc(1.65em * var(--roo-font-size-multiplier, 1)); font-weight: 700; margin: 1.35em 0 0.5em; } h2 { - font-size: 1.35em; + font-size: calc(1.35em * var(--roo-font-size-multiplier, 1)); font-weight: 500; margin: 1.35em 0 0.5em; } h3 { - font-size: 1.2em; + font-size: calc(1.2em * var(--roo-font-size-multiplier, 1)); font-weight: 500; } diff --git a/webview-ui/src/components/common/MermaidBlock.tsx b/webview-ui/src/components/common/MermaidBlock.tsx index 95c795fdc5..19bcc6a614 100644 --- a/webview-ui/src/components/common/MermaidBlock.tsx +++ b/webview-ui/src/components/common/MermaidBlock.tsx @@ -49,7 +49,7 @@ mermaid.initialize({ suppressErrorRendering: true, themeVariables: { ...MERMAID_THEME, - fontSize: "16px", + fontSize: "calc(16px * var(--roo-font-size-multiplier, 1))", fontFamily: "var(--vscode-font-family, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif)", // Additional styling @@ -163,7 +163,7 @@ export default function MermaidBlock({ code }: MermaidBlockProps) { style={{ borderBottom: isErrorExpanded ? "1px solid var(--vscode-editorGroup-border)" : "none", fontWeight: "normal", - fontSize: "var(--vscode-font-size)", + fontSize: "calc(var(--vscode-font-size) * var(--roo-font-size-multiplier, 1))", color: "var(--vscode-editor-foreground)", display: "flex", alignItems: "center", @@ -183,7 +183,7 @@ export default function MermaidBlock({ code }: MermaidBlockProps) { style={{ color: "var(--vscode-editorWarning-foreground)", opacity: 0.8, - fontSize: 16, + fontSize: "calc(16px * var(--roo-font-size-multiplier, 1))", marginBottom: "-1.5px", }}> {t("common:mermaid.render_error")} @@ -289,7 +289,7 @@ const LoadingMessage = styled.div` padding: 8px 0; color: var(--vscode-descriptionForeground); font-style: italic; - font-size: 0.9em; + font-size: calc(0.9em * var(--roo-font-size-multiplier, 1)); ` const CopyButton = styled.button` diff --git a/webview-ui/src/components/common/MermaidButton.tsx b/webview-ui/src/components/common/MermaidButton.tsx index 8d77502c6d..0dc83335ec 100644 --- a/webview-ui/src/components/common/MermaidButton.tsx +++ b/webview-ui/src/components/common/MermaidButton.tsx @@ -205,7 +205,12 @@ export function MermaidButton({ containerRef, code, isLoading, svgToPng, childre className="w-full min-h-[200px] bg-vscode-editor-background text-vscode-editor-foreground border border-vscode-editorGroup-border rounded-[3px] p-2 font-mono resize-y outline-none" readOnly value={code} - style={{ height: "100%", minHeight: "unset", fontSize: "var(--vscode-editor-font-size)" }} + style={{ + height: "100%", + minHeight: "unset", + fontSize: + "calc(var(--vscode-editor-font-size, var(--vscode-font-size)) * var(--roo-font-size-multiplier, 1))", + }} /> )}
diff --git a/webview-ui/src/components/common/Thumbnails.tsx b/webview-ui/src/components/common/Thumbnails.tsx index d0db36d561..0790133862 100644 --- a/webview-ui/src/components/common/Thumbnails.tsx +++ b/webview-ui/src/components/common/Thumbnails.tsx @@ -85,7 +85,7 @@ const Thumbnails = ({ images, style, setImages, onHeightChange }: ThumbnailsProp className="codicon codicon-close" style={{ color: "var(--vscode-foreground)", - fontSize: 10, + fontSize: "calc(10px * var(--roo-font-size-multiplier, 1))", fontWeight: "bold", }}>
diff --git a/webview-ui/src/components/mcp/McpEnabledToggle.tsx b/webview-ui/src/components/mcp/McpEnabledToggle.tsx index 648cb77142..ac8492b183 100644 --- a/webview-ui/src/components/mcp/McpEnabledToggle.tsx +++ b/webview-ui/src/components/mcp/McpEnabledToggle.tsx @@ -1,28 +1,26 @@ -import { VSCodeCheckbox } from "@vscode/webview-ui-toolkit/react" -import { FormEvent } from "react" import { useExtensionState } from "@src/context/ExtensionStateContext" import { useAppTranslation } from "@src/i18n/TranslationContext" import { vscode } from "@src/utils/vscode" +import { Checkbox } from "@/components/ui/checkbox" const McpEnabledToggle = () => { const { mcpEnabled, setMcpEnabled } = useExtensionState() const { t } = useAppTranslation() - const handleChange = (e: Event | FormEvent) => { - const target = ("target" in e ? e.target : null) as HTMLInputElement | null - if (!target) return - setMcpEnabled(target.checked) - vscode.postMessage({ type: "mcpEnabled", bool: target.checked }) + const handleChange = (checked: boolean) => { + setMcpEnabled(checked) + vscode.postMessage({ type: "mcpEnabled", bool: checked }) } return (
- +
+ {t("mcp:enableToggle.title")} - +

diff --git a/webview-ui/src/components/mcp/McpResourceRow.tsx b/webview-ui/src/components/mcp/McpResourceRow.tsx index 651a569a3c..54ce126690 100644 --- a/webview-ui/src/components/mcp/McpResourceRow.tsx +++ b/webview-ui/src/components/mcp/McpResourceRow.tsx @@ -25,7 +25,7 @@ const McpResourceRow = ({ item }: McpResourceRowProps) => {

@@ -39,7 +39,7 @@ const McpResourceRow = ({ item }: McpResourceRowProps) => {
Returns {/* Always Allow checkbox - only show when tool is enabled */} {alwaysAllowMcp && isToolEnabled && ( - +
+ {t("mcp:tool.alwaysAllow")} - +
)} {/* Enabled toggle switch - only show in settings context */} diff --git a/webview-ui/src/components/mcp/McpView.tsx b/webview-ui/src/components/mcp/McpView.tsx index 21ad1c2652..e31f2f179b 100644 --- a/webview-ui/src/components/mcp/McpView.tsx +++ b/webview-ui/src/components/mcp/McpView.tsx @@ -2,12 +2,12 @@ import React, { useState } from "react" import { Trans } from "react-i18next" import { VSCodeButton, - VSCodeCheckbox, VSCodeLink, VSCodePanels, VSCodePanelTab, VSCodePanelView, } from "@vscode/webview-ui-toolkit/react" +import { Checkbox } from "@/components/ui/checkbox" import { McpServer } from "@roo/mcp" @@ -60,7 +60,7 @@ const McpView = ({ onDone }: McpViewProps) => {
@@ -78,17 +78,20 @@ const McpView = ({ onDone }: McpViewProps) => { {mcpEnabled && ( <>
- { - setEnableMcpServerCreation(e.target.checked) - vscode.postMessage({ type: "enableMcpServerCreation", bool: e.target.checked }) - }}> +
+ { + const isChecked = checked === true + setEnableMcpServerCreation(isChecked) + vscode.postMessage({ type: "enableMcpServerCreation", bool: isChecked }) + }} + /> {t("mcp:enableServerCreation.title")} - +
@@ -178,7 +181,7 @@ const McpView = ({ onDone }: McpViewProps) => {
setShowDeleteConfirm(true)} style={{ marginRight: "8px" }}> - +
@@ -431,7 +438,11 @@ const ServerRow = ({ server, alwaysAllowMcp }: { server: McpServer; alwaysAllowM {server.instructions && ( -
+
{server.instructions}
@@ -495,7 +506,7 @@ const ServerRow = ({ server, alwaysAllowMcp }: { server: McpServer; alwaysAllowM
@@ -508,7 +519,7 @@ const ServerRow = ({ server, alwaysAllowMcp }: { server: McpServer; alwaysAllowM !server.disabled && (
{ render() - const checkbox = screen.getByRole("checkbox") as HTMLInputElement - expect(checkbox.checked).toBe(true) + const checkbox = screen.getByRole("checkbox") + expect(checkbox).toHaveAttribute("aria-checked", "true") }) it("prevents event propagation when clicking the checkbox", () => { diff --git a/webview-ui/src/components/modes/ModesView.tsx b/webview-ui/src/components/modes/ModesView.tsx index 0283fbbec4..233c256703 100644 --- a/webview-ui/src/components/modes/ModesView.tsx +++ b/webview-ui/src/components/modes/ModesView.tsx @@ -1,12 +1,12 @@ import React, { useState, useEffect, useMemo, useCallback, useRef } from "react" import { - VSCodeCheckbox, VSCodeRadioGroup, VSCodeRadio, VSCodeTextArea, VSCodeLink, VSCodeTextField, } from "@vscode/webview-ui-toolkit/react" +import { Checkbox } from "@/components/ui/checkbox" import { Trans } from "react-i18next" import { ChevronDown, X, Upload, Download } from "lucide-react" @@ -1021,32 +1021,45 @@ const ModesView = ({ onDone }: ModesViewProps) => { : currentMode?.groups?.some((g) => getGroupName(g) === group) return ( - - {t(`prompts:tools.toolNames.${group}`)} - {group === "edit" && ( -
- {t("prompts:tools.allowedFiles")}{" "} - {(() => { - const currentMode = getCurrentMode() - const editGroup = currentMode?.groups?.find( - (g) => - Array.isArray(g) && - g[0] === "edit" && - g[1]?.fileRegex, - ) - if (!Array.isArray(editGroup)) return t("prompts:allFiles") - return ( - editGroup[1].description || - `/${editGroup[1].fileRegex}/` - ) - })()} -
- )} - +
+ { + const event = { + target: { checked: checked === true }, + } as any + handleGroupChange( + group, + Boolean(isCustomMode), + customMode, + )(event) + }} + disabled={!isCustomMode} + /> +
+ {t(`prompts:tools.toolNames.${group}`)} + {group === "edit" && ( +
+ {t("prompts:tools.allowedFiles")}{" "} + {(() => { + const currentMode = getCurrentMode() + const editGroup = currentMode?.groups?.find( + (g) => + Array.isArray(g) && + g[0] === "edit" && + g[1]?.fileRegex, + ) + if (!Array.isArray(editGroup)) + return t("prompts:allFiles") + return ( + editGroup[1].description || + `/${editGroup[1].fileRegex}/` + ) + })()} +
+ )} +
+
) })}
@@ -1458,7 +1471,7 @@ const ModesView = ({ onDone }: ModesViewProps) => {
@@ -1519,23 +1532,22 @@ const ModesView = ({ onDone }: ModesViewProps) => {
{availableGroups.map((group) => ( - getGroupName(g) === group)} - onChange={(e: Event | React.FormEvent) => { - const target = - (e as CustomEvent)?.detail?.target || (e.target as HTMLInputElement) - const checked = target.checked - if (checked) { - setNewModeGroups([...newModeGroups, group]) - } else { - setNewModeGroups( - newModeGroups.filter((g) => getGroupName(g) !== group), - ) - } - }}> - {t(`prompts:tools.toolNames.${group}`)} - +
+ getGroupName(g) === group)} + onCheckedChange={(checked) => { + const isChecked = checked === true + if (isChecked) { + setNewModeGroups([...newModeGroups, group]) + } else { + setNewModeGroups( + newModeGroups.filter((g) => getGroupName(g) !== group), + ) + } + }} + /> + {t(`prompts:tools.toolNames.${group}`)} +
))}
{groupsError && ( diff --git a/webview-ui/src/components/settings/About.tsx b/webview-ui/src/components/settings/About.tsx index 9afee12d72..8e4ffa9e5c 100644 --- a/webview-ui/src/components/settings/About.tsx +++ b/webview-ui/src/components/settings/About.tsx @@ -2,7 +2,8 @@ import { HTMLAttributes } from "react" import { useAppTranslation } from "@/i18n/TranslationContext" import { Trans } from "react-i18next" import { Info, Download, Upload, TriangleAlert } from "lucide-react" -import { VSCodeCheckbox, VSCodeLink } from "@vscode/webview-ui-toolkit/react" +import { VSCodeLink } from "@vscode/webview-ui-toolkit/react" +import { Checkbox } from "@/components/ui/checkbox" import type { TelemetrySetting } from "@roo-code/types" @@ -39,14 +40,16 @@ export const About = ({ telemetrySetting, setTelemetrySetting, className, ...pro
- { - const checked = e.target.checked === true - setTelemetrySetting(checked ? "enabled" : "disabled") - }}> - {t("settings:footer.telemetry.label")} - +
+ { + const isChecked = checked === true + setTelemetrySetting(isChecked ? "enabled" : "disabled") + }} + /> + {t("settings:footer.telemetry.label")} +

- { - const newValue = !(autoApprovalEnabled ?? false) - setAutoApprovalEnabled(newValue) - vscode.postMessage({ type: "autoApprovalEnabled", bool: newValue }) - }}> +
+ { + const newValue = !(autoApprovalEnabled ?? false) + setAutoApprovalEnabled(newValue) + vscode.postMessage({ type: "autoApprovalEnabled", bool: newValue }) + }} + /> {t("settings:autoApprove.enabled")} - +

{t("settings:autoApprove.description")}

@@ -191,16 +193,18 @@ export const AutoApproveSettings = ({

{t("settings:autoApprove.readOnly.label")}
- - setCachedStateField("alwaysAllowReadOnlyOutsideWorkspace", e.target.checked) - } - data-testid="always-allow-readonly-outside-workspace-checkbox"> +
+ + setCachedStateField("alwaysAllowReadOnlyOutsideWorkspace", checked === true) + } + data-testid="always-allow-readonly-outside-workspace-checkbox" + /> {t("settings:autoApprove.readOnly.outsideWorkspace.label")} - +
{t("settings:autoApprove.readOnly.outsideWorkspace.description")}
@@ -215,29 +219,33 @@ export const AutoApproveSettings = ({
{t("settings:autoApprove.write.label")}
- - setCachedStateField("alwaysAllowWriteOutsideWorkspace", e.target.checked) - } - data-testid="always-allow-write-outside-workspace-checkbox"> +
+ + setCachedStateField("alwaysAllowWriteOutsideWorkspace", checked === true) + } + data-testid="always-allow-write-outside-workspace-checkbox" + /> {t("settings:autoApprove.write.outsideWorkspace.label")} - +
{t("settings:autoApprove.write.outsideWorkspace.description")}
- - setCachedStateField("alwaysAllowWriteProtected", e.target.checked) - } - data-testid="always-allow-write-protected-checkbox"> +
+ + setCachedStateField("alwaysAllowWriteProtected", checked === true) + } + data-testid="always-allow-write-protected-checkbox" + /> {t("settings:autoApprove.write.protected.label")} - +
{t("settings:autoApprove.write.protected.description")}
diff --git a/webview-ui/src/components/settings/BrowserSettings.tsx b/webview-ui/src/components/settings/BrowserSettings.tsx index 76b4a823be..68700e6361 100644 --- a/webview-ui/src/components/settings/BrowserSettings.tsx +++ b/webview-ui/src/components/settings/BrowserSettings.tsx @@ -1,4 +1,4 @@ -import { VSCodeButton, VSCodeCheckbox, VSCodeTextField, VSCodeLink } from "@vscode/webview-ui-toolkit/react" +import { VSCodeButton, VSCodeTextField, VSCodeLink } from "@vscode/webview-ui-toolkit/react" import { SquareMousePointer } from "lucide-react" import { HTMLAttributes, useEffect, useMemo, useState } from "react" import { Trans } from "react-i18next" @@ -7,6 +7,7 @@ import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectVa import { useAppTranslation } from "@/i18n/TranslationContext" import { vscode } from "@/utils/vscode" import { buildDocLink } from "@src/utils/docLinks" +import { Checkbox } from "@/components/ui/checkbox" import { Section } from "./Section" import { SectionHeader } from "./SectionHeader" @@ -108,11 +109,13 @@ export const BrowserSettings = ({
- setCachedStateField("browserToolEnabled", e.target.checked)}> +
+ setCachedStateField("browserToolEnabled", checked === true)} + /> {t("settings:browser.enable.label")} - +
- { - // Update the global state - remoteBrowserEnabled now means "enable remote browser connection". - setCachedStateField("remoteBrowserEnabled", e.target.checked) - - if (!e.target.checked) { - // If disabling remote browser, clear the custom URL. - setCachedStateField("remoteBrowserHost", undefined) - } - }}> +
+ { + const isChecked = checked === true + // Update the global state - remoteBrowserEnabled now means "enable remote browser connection". + setCachedStateField("remoteBrowserEnabled", isChecked) + + if (!isChecked) { + // If disabling remote browser, clear the custom URL. + setCachedStateField("remoteBrowserHost", undefined) + } + }} + /> - +
{t("settings:browser.remote.description")}
diff --git a/webview-ui/src/components/settings/CheckpointSettings.tsx b/webview-ui/src/components/settings/CheckpointSettings.tsx index bc5f656bb9..9038fd3098 100644 --- a/webview-ui/src/components/settings/CheckpointSettings.tsx +++ b/webview-ui/src/components/settings/CheckpointSettings.tsx @@ -1,9 +1,10 @@ import { HTMLAttributes } from "react" import { useAppTranslation } from "@/i18n/TranslationContext" -import { VSCodeCheckbox, VSCodeLink } from "@vscode/webview-ui-toolkit/react" +import { VSCodeLink } from "@vscode/webview-ui-toolkit/react" import { GitBranch } from "lucide-react" import { Trans } from "react-i18next" import { buildDocLink } from "@src/utils/docLinks" +import { Checkbox } from "@/components/ui/checkbox" import { SetCachedStateField } from "./types" import { SectionHeader } from "./SectionHeader" @@ -27,13 +28,15 @@ export const CheckpointSettings = ({ enableCheckpoints, setCachedStateField, ...
- { - setCachedStateField("enableCheckpoints", e.target.checked) - }}> +
+ { + setCachedStateField("enableCheckpoints", checked === true) + }} + /> {t("settings:checkpoints.enable.label")} - +
- setCachedStateField("showRooIgnoredFiles", e.target.checked)} - data-testid="show-rooignored-files-checkbox"> +
+ setCachedStateField("showRooIgnoredFiles", checked === true)} + data-testid="show-rooignored-files-checkbox" + /> - +
{t("settings:contextManagement.rooignore.description")}
@@ -197,14 +199,16 @@ export const ContextManagementSettings = ({ disabled={maxReadFileLine === -1} /> {t("settings:contextManagement.maxReadFile.lines")} - - setCachedStateField("maxReadFileLine", e.target.checked ? -1 : 500) - } - data-testid="max-read-file-always-full-checkbox"> - {t("settings:contextManagement.maxReadFile.always_full_read")} - +
+ + setCachedStateField("maxReadFileLine", checked === true ? -1 : 500) + } + data-testid="max-read-file-always-full-checkbox" + /> + {t("settings:contextManagement.maxReadFile.always_full_read")} +
@@ -269,14 +273,18 @@ export const ContextManagementSettings = ({
- setCachedStateField("includeDiagnosticMessages", e.target.checked)} - data-testid="include-diagnostic-messages-checkbox"> +
+ + setCachedStateField("includeDiagnosticMessages", checked === true) + } + data-testid="include-diagnostic-messages-checkbox" + /> - +
{t("settings:contextManagement.diagnostics.includeMessages.description")}
@@ -358,12 +366,14 @@ export const ContextManagementSettings = ({
- setCachedStateField("autoCondenseContext", e.target.checked)} - data-testid="auto-condense-context-checkbox"> +
+ setCachedStateField("autoCondenseContext", checked === true)} + data-testid="auto-condense-context-checkbox" + /> {t("settings:contextManagement.autoCondenseContext.name")} - +
{autoCondenseContext && (
diff --git a/webview-ui/src/components/settings/DiffSettingsControl.tsx b/webview-ui/src/components/settings/DiffSettingsControl.tsx index 16bc2e7241..13ac8b80bd 100644 --- a/webview-ui/src/components/settings/DiffSettingsControl.tsx +++ b/webview-ui/src/components/settings/DiffSettingsControl.tsx @@ -1,7 +1,7 @@ import React, { useCallback } from "react" import { Slider } from "@/components/ui" import { useAppTranslation } from "@/i18n/TranslationContext" -import { VSCodeCheckbox } from "@vscode/webview-ui-toolkit/react" +import { Checkbox } from "@/components/ui/checkbox" interface DiffSettingsControlProps { diffEnabled?: boolean @@ -17,8 +17,8 @@ export const DiffSettingsControl: React.FC = ({ const { t } = useAppTranslation() const handleDiffEnabledChange = useCallback( - (e: any) => { - onChange("diffEnabled", e.target.checked) + (checked: boolean) => { + onChange("diffEnabled", checked) }, [onChange], ) @@ -33,9 +33,10 @@ export const DiffSettingsControl: React.FC = ({ return (
- +
+ {t("settings:advanced.diff.label")} - +
{t("settings:advanced.diff.description")}
diff --git a/webview-ui/src/components/settings/ExperimentalFeature.tsx b/webview-ui/src/components/settings/ExperimentalFeature.tsx index a96a00a426..e8f0e792be 100644 --- a/webview-ui/src/components/settings/ExperimentalFeature.tsx +++ b/webview-ui/src/components/settings/ExperimentalFeature.tsx @@ -1,5 +1,5 @@ -import { VSCodeCheckbox } from "@vscode/webview-ui-toolkit/react" import { useAppTranslation } from "@/i18n/TranslationContext" +import { Checkbox } from "@/components/ui/checkbox" interface ExperimentalFeatureProps { enabled: boolean @@ -18,9 +18,8 @@ export const ExperimentalFeature = ({ enabled, onChange, experimentKey }: Experi return (
- onChange(e.target.checked)}> - {t(nameKey)} - + + {t(nameKey)}

{t(descriptionKey)}

diff --git a/webview-ui/src/components/settings/ImageGenerationSettings.tsx b/webview-ui/src/components/settings/ImageGenerationSettings.tsx index 53ae18d1a7..164da9911e 100644 --- a/webview-ui/src/components/settings/ImageGenerationSettings.tsx +++ b/webview-ui/src/components/settings/ImageGenerationSettings.tsx @@ -1,6 +1,7 @@ import React, { useState, useEffect } from "react" -import { VSCodeCheckbox, VSCodeTextField, VSCodeDropdown, VSCodeOption } from "@vscode/webview-ui-toolkit/react" +import { VSCodeTextField, VSCodeDropdown, VSCodeOption } from "@vscode/webview-ui-toolkit/react" import { useAppTranslation } from "@/i18n/TranslationContext" +import { Checkbox } from "@/components/ui/checkbox" interface ImageGenerationSettingsProps { enabled: boolean @@ -54,9 +55,8 @@ export const ImageGenerationSettings = ({
- onChange(e.target.checked)}> - {t("settings:experimental.IMAGE_GENERATION.name")} - + + {t("settings:experimental.IMAGE_GENERATION.name")}

{t("settings:experimental.IMAGE_GENERATION.description")} diff --git a/webview-ui/src/components/settings/NotificationSettings.tsx b/webview-ui/src/components/settings/NotificationSettings.tsx index 9610cabad8..968359dae6 100644 --- a/webview-ui/src/components/settings/NotificationSettings.tsx +++ b/webview-ui/src/components/settings/NotificationSettings.tsx @@ -1,7 +1,7 @@ import { HTMLAttributes } from "react" import { useAppTranslation } from "@/i18n/TranslationContext" -import { VSCodeCheckbox } from "@vscode/webview-ui-toolkit/react" import { Bell } from "lucide-react" +import { Checkbox } from "@/components/ui/checkbox" import { SetCachedStateField } from "./types" import { SectionHeader } from "./SectionHeader" @@ -36,12 +36,14 @@ export const NotificationSettings = ({

- setCachedStateField("ttsEnabled", e.target.checked)} - data-testid="tts-enabled-checkbox"> +
+ setCachedStateField("ttsEnabled", checked === true)} + data-testid="tts-enabled-checkbox" + /> {t("settings:notifications.tts.label")} - +
{t("settings:notifications.tts.description")}
@@ -69,12 +71,14 @@ export const NotificationSettings = ({ )}
- setCachedStateField("soundEnabled", e.target.checked)} - data-testid="sound-enabled-checkbox"> +
+ setCachedStateField("soundEnabled", checked === true)} + data-testid="sound-enabled-checkbox" + /> {t("settings:notifications.sound.label")} - +
{t("settings:notifications.sound.description")}
diff --git a/webview-ui/src/components/settings/PromptsSettings.tsx b/webview-ui/src/components/settings/PromptsSettings.tsx index d09b53fe47..8a0591347f 100644 --- a/webview-ui/src/components/settings/PromptsSettings.tsx +++ b/webview-ui/src/components/settings/PromptsSettings.tsx @@ -1,5 +1,6 @@ import React, { useState, useEffect } from "react" -import { VSCodeTextArea, VSCodeCheckbox } from "@vscode/webview-ui-toolkit/react" +import { VSCodeTextArea } from "@vscode/webview-ui-toolkit/react" +import { Checkbox } from "@/components/ui/checkbox" import { supportPrompt, SupportPromptType } from "@roo/support-prompt" @@ -234,20 +235,22 @@ const PromptsSettings = ({ {activeSupportOption === "ENHANCE" && ( <>
- { - const value = e.target.checked - setIncludeTaskHistoryInEnhance(value) - vscode.postMessage({ - type: "includeTaskHistoryInEnhance", - bool: value, - }) - }}> +
+ { + const value = checked === true + setIncludeTaskHistoryInEnhance(value) + vscode.postMessage({ + type: "includeTaskHistoryInEnhance", + bool: value, + }) + }} + /> {t("prompts:supportPrompts.enhance.includeTaskHistory")} - +
{t("prompts:supportPrompts.enhance.includeTaskHistoryDescription")}
diff --git a/webview-ui/src/components/settings/TemperatureControl.tsx b/webview-ui/src/components/settings/TemperatureControl.tsx index acee709074..8d52f46ac2 100644 --- a/webview-ui/src/components/settings/TemperatureControl.tsx +++ b/webview-ui/src/components/settings/TemperatureControl.tsx @@ -1,9 +1,9 @@ -import { VSCodeCheckbox } from "@vscode/webview-ui-toolkit/react" import { useEffect, useState } from "react" import { useAppTranslation } from "@/i18n/TranslationContext" import { useDebounce } from "react-use" import { Slider } from "@/components/ui" +import { Checkbox } from "@/components/ui/checkbox" interface TemperatureControlProps { value: number | undefined | null @@ -28,20 +28,22 @@ export const TemperatureControl = ({ value, onChange, maxValue = 1 }: Temperatur return ( <>
- { - const isChecked = e.target.checked - setIsCustomTemperature(isChecked) +
+ { + const isChecked = checked === true + setIsCustomTemperature(isChecked) - if (!isChecked) { - setInputValue(null) // Unset the temperature, note that undefined is unserializable. - } else { - setInputValue(value ?? 0) // Use the value from apiConfiguration, if set. - } - }}> + if (!isChecked) { + setInputValue(null) // Unset the temperature, note that undefined is unserializable. + } else { + setInputValue(value ?? 0) // Use the value from apiConfiguration, if set. + } + }} + /> - +
{t("settings:temperature.description")}
diff --git a/webview-ui/src/components/settings/TerminalSettings.tsx b/webview-ui/src/components/settings/TerminalSettings.tsx index 833fe93dde..85c012574a 100644 --- a/webview-ui/src/components/settings/TerminalSettings.tsx +++ b/webview-ui/src/components/settings/TerminalSettings.tsx @@ -2,10 +2,11 @@ import { HTMLAttributes, useState, useCallback } from "react" import { useAppTranslation } from "@/i18n/TranslationContext" import { vscode } from "@/utils/vscode" import { SquareTerminal } from "lucide-react" -import { VSCodeCheckbox, VSCodeLink } from "@vscode/webview-ui-toolkit/react" +import { VSCodeLink } from "@vscode/webview-ui-toolkit/react" import { Trans } from "react-i18next" import { buildDocLink } from "@src/utils/docLinks" import { useEvent, useMount } from "react-use" +import { Checkbox } from "@/components/ui/checkbox" import { ExtensionMessage } from "@roo/ExtensionMessage" @@ -163,14 +164,16 @@ export const TerminalSettings = ({
- - setCachedStateField("terminalCompressProgressBar", e.target.checked) - } - data-testid="terminal-compress-progress-bar-checkbox"> +
+ + setCachedStateField("terminalCompressProgressBar", checked === true) + } + data-testid="terminal-compress-progress-bar-checkbox" + /> {t("settings:terminal.compressProgressBar.label")} - +
- { - setInheritEnv(e.target.checked) - vscode.postMessage({ - type: "updateVSCodeSetting", - setting: "terminal.integrated.inheritEnv", - value: e.target.checked, - }) - }} - data-testid="terminal-inherit-env-checkbox"> +
+ { + const isChecked = checked === true + setInheritEnv(isChecked) + vscode.postMessage({ + type: "updateVSCodeSetting", + setting: "terminal.integrated.inheritEnv", + value: isChecked as any, + }) + }} + data-testid="terminal-inherit-env-checkbox" + /> {t("settings:terminal.inheritEnv.label")} - +
- - setCachedStateField("terminalShellIntegrationDisabled", e.target.checked) - }> +
+ + setCachedStateField("terminalShellIntegrationDisabled", checked === true) + } + /> {t("settings:terminal.shellIntegrationDisabled.label")} - +
- - setCachedStateField("terminalPowershellCounter", e.target.checked) - } - data-testid="terminal-powershell-counter-checkbox"> +
+ + setCachedStateField("terminalPowershellCounter", checked === true) + } + data-testid="terminal-powershell-counter-checkbox" + /> {t("settings:terminal.powershellCounter.label")} - +
- - setCachedStateField("terminalZshClearEolMark", e.target.checked) - } - data-testid="terminal-zsh-clear-eol-mark-checkbox"> +
+ + setCachedStateField("terminalZshClearEolMark", checked === true) + } + data-testid="terminal-zsh-clear-eol-mark-checkbox" + /> {t("settings:terminal.zshClearEolMark.label")} - +
- setCachedStateField("terminalZshOhMy", e.target.checked)} - data-testid="terminal-zsh-oh-my-checkbox"> +
+ + setCachedStateField("terminalZshOhMy", checked === true) + } + data-testid="terminal-zsh-oh-my-checkbox" + /> {t("settings:terminal.zshOhMy.label")} - +
- setCachedStateField("terminalZshP10k", e.target.checked)} - data-testid="terminal-zsh-p10k-checkbox"> +
+ + setCachedStateField("terminalZshP10k", checked === true) + } + data-testid="terminal-zsh-p10k-checkbox" + /> {t("settings:terminal.zshP10k.label")} - +
- setCachedStateField("terminalZdotdir", e.target.checked)} - data-testid="terminal-zdotdir-checkbox"> +
+ + setCachedStateField("terminalZdotdir", checked === true) + } + data-testid="terminal-zdotdir-checkbox" + /> {t("settings:terminal.zdotdir.label")} - +
= ( const { t } = useAppTranslation() const handleTodoListEnabledChange = useCallback( - (e: any) => { - onChange("todoListEnabled", e.target.checked) + (checked: boolean) => { + onChange("todoListEnabled", checked) }, [onChange], ) @@ -23,9 +23,10 @@ export const TodoListSettingsControl: React.FC = ( return (
- +
+ {t("settings:advanced.todoList.label")} - +
{t("settings:advanced.todoList.description")}
diff --git a/webview-ui/src/components/settings/UISettings.tsx b/webview-ui/src/components/settings/UISettings.tsx index 2de16e6882..736c704056 100644 --- a/webview-ui/src/components/settings/UISettings.tsx +++ b/webview-ui/src/components/settings/UISettings.tsx @@ -1,8 +1,8 @@ import { HTMLAttributes } from "react" import { useAppTranslation } from "@/i18n/TranslationContext" -import { VSCodeCheckbox } from "@vscode/webview-ui-toolkit/react" import { Glasses } from "lucide-react" import { telemetryClient } from "@/utils/TelemetryClient" +import { Checkbox } from "@/components/ui/checkbox" import { SetCachedStateField } from "./types" import { SectionHeader } from "./SectionHeader" @@ -39,12 +39,19 @@ export const UISettings = ({ reasoningBlockCollapsed, setCachedStateField, ...pr
{/* Collapse Thinking Messages Setting */}
- handleReasoningBlockCollapsedChange(e.target.checked)} - data-testid="collapse-thinking-checkbox"> - {t("settings:ui.collapseThinking.label")} - +
+ +
{t("settings:ui.collapseThinking.description")}
diff --git a/webview-ui/src/components/settings/__tests__/ContextManagementSettings.spec.tsx b/webview-ui/src/components/settings/__tests__/ContextManagementSettings.spec.tsx index 61444267f2..1b34ba70b6 100644 --- a/webview-ui/src/components/settings/__tests__/ContextManagementSettings.spec.tsx +++ b/webview-ui/src/components/settings/__tests__/ContextManagementSettings.spec.tsx @@ -119,7 +119,7 @@ describe("ContextManagementSettings", () => { render() const checkbox = screen.getByTestId("include-diagnostic-messages-checkbox") - expect(checkbox.querySelector("input")).toBeChecked() + expect(checkbox).toHaveAttribute("data-state", "checked") const slider = screen.getByTestId("max-diagnostic-messages-slider") expect(slider).toBeInTheDocument() @@ -130,7 +130,7 @@ describe("ContextManagementSettings", () => { render() const checkbox = screen.getByTestId("include-diagnostic-messages-checkbox") - expect(checkbox.querySelector("input")).not.toBeChecked() + expect(checkbox).toHaveAttribute("data-state", "unchecked") // Slider should still be rendered when diagnostics are disabled expect(screen.getByTestId("max-diagnostic-messages-slider")).toBeInTheDocument() @@ -141,7 +141,7 @@ describe("ContextManagementSettings", () => { const setCachedStateField = vi.fn() render() - const checkbox = screen.getByTestId("include-diagnostic-messages-checkbox").querySelector("input")! + const checkbox = screen.getByTestId("include-diagnostic-messages-checkbox") fireEvent.click(checkbox) await waitFor(() => { @@ -332,7 +332,7 @@ describe("ContextManagementSettings", () => { // Always full read checkbox const alwaysFullReadCheckbox = screen.getByTestId("max-read-file-always-full-checkbox") expect(alwaysFullReadCheckbox).toBeInTheDocument() - expect(alwaysFullReadCheckbox).not.toBeChecked() + expect(alwaysFullReadCheckbox).toHaveAttribute("data-state", "unchecked") }) it("updates max read file line setting", () => { @@ -399,8 +399,7 @@ describe("ContextManagementSettings", () => { render() const checkbox = screen.getByTestId("auto-condense-context-checkbox") - const input = checkbox.querySelector('input[type="checkbox"]') - expect(input).toBeChecked() + expect(checkbox).toHaveAttribute("data-state", "checked") // Toggle off fireEvent.click(checkbox) @@ -445,8 +444,7 @@ describe("ContextManagementSettings", () => { render() const checkbox = screen.getByTestId("max-read-file-always-full-checkbox") - const input = checkbox.querySelector('input[type="checkbox"]') - expect(input).toBeChecked() + expect(checkbox).toHaveAttribute("data-state", "checked") }) it("handles boundary values for sliders", () => { @@ -507,7 +505,7 @@ describe("ContextManagementSettings", () => { expect(input).toHaveValue(-1) expect(input).not.toBeDisabled() // Input is not disabled when maxReadFileLine is undefined (only when explicitly set to -1) expect(checkbox).toBeInTheDocument() - expect(checkbox).not.toBeChecked() // Checkbox is not checked when maxReadFileLine is undefined (only when explicitly set to -1) + expect(checkbox).toHaveAttribute("data-state", "unchecked") // Checkbox is not checked when maxReadFileLine is undefined (only when explicitly set to -1) }) }) diff --git a/webview-ui/src/components/settings/__tests__/UISettings.spec.tsx b/webview-ui/src/components/settings/__tests__/UISettings.spec.tsx index 43bb013a08..73e2156061 100644 --- a/webview-ui/src/components/settings/__tests__/UISettings.spec.tsx +++ b/webview-ui/src/components/settings/__tests__/UISettings.spec.tsx @@ -16,8 +16,8 @@ describe("UISettings", () => { it("displays the correct initial state", () => { const { getByTestId } = render() - const checkbox = getByTestId("collapse-thinking-checkbox") as HTMLInputElement - expect(checkbox.checked).toBe(true) + const checkbox = getByTestId("collapse-thinking-checkbox") + expect(checkbox).toHaveAttribute("data-state", "checked") }) it("calls setCachedStateField when checkbox is toggled", async () => { @@ -34,10 +34,10 @@ describe("UISettings", () => { it("updates checkbox state when prop changes", () => { const { getByTestId, rerender } = render() - const checkbox = getByTestId("collapse-thinking-checkbox") as HTMLInputElement - expect(checkbox.checked).toBe(false) + const checkbox = getByTestId("collapse-thinking-checkbox") + expect(checkbox).toHaveAttribute("data-state", "unchecked") rerender() - expect(checkbox.checked).toBe(true) + expect(checkbox).toHaveAttribute("data-state", "checked") }) }) diff --git a/webview-ui/src/components/settings/providers/Bedrock.tsx b/webview-ui/src/components/settings/providers/Bedrock.tsx index 1b3143fa08..32c2fc8e00 100644 --- a/webview-ui/src/components/settings/providers/Bedrock.tsx +++ b/webview-ui/src/components/settings/providers/Bedrock.tsx @@ -153,7 +153,7 @@ export const Bedrock = ({ apiConfiguration, setApiConfigurationField, selectedMo
diff --git a/webview-ui/src/components/settings/providers/ClaudeCode.tsx b/webview-ui/src/components/settings/providers/ClaudeCode.tsx index 5ae5f7de28..9983b3277f 100644 --- a/webview-ui/src/components/settings/providers/ClaudeCode.tsx +++ b/webview-ui/src/components/settings/providers/ClaudeCode.tsx @@ -33,7 +33,7 @@ export const ClaudeCode: React.FC = ({ apiConfiguration, setApi

diff --git a/webview-ui/src/components/settings/providers/LiteLLM.tsx b/webview-ui/src/components/settings/providers/LiteLLM.tsx index 6579b2432d..ed26a647b0 100644 --- a/webview-ui/src/components/settings/providers/LiteLLM.tsx +++ b/webview-ui/src/components/settings/providers/LiteLLM.tsx @@ -1,5 +1,6 @@ import { useCallback, useState, useEffect, useRef } from "react" -import { VSCodeTextField, VSCodeCheckbox } from "@vscode/webview-ui-toolkit/react" +import { VSCodeTextField } from "@vscode/webview-ui-toolkit/react" +import { Checkbox } from "@/components/ui/checkbox" import { type ProviderSettings, type OrganizationAllowList, litellmDefaultModelId } from "@roo-code/types" @@ -160,13 +161,15 @@ export const LiteLLM = ({ if (selectedModel?.supportsPromptCache) { return (

- { - setApiConfigurationField("litellmUsePromptCache", e.target.checked) - }}> +
+ { + setApiConfigurationField("litellmUsePromptCache", checked === true) + }} + /> {t("settings:providers.enablePromptCaching")} - +
{t("settings:providers.enablePromptCachingTitle")}
diff --git a/webview-ui/src/components/settings/providers/OpenAICompatible.tsx b/webview-ui/src/components/settings/providers/OpenAICompatible.tsx index 736b0253c4..4a2d1f5147 100644 --- a/webview-ui/src/components/settings/providers/OpenAICompatible.tsx +++ b/webview-ui/src/components/settings/providers/OpenAICompatible.tsx @@ -384,7 +384,7 @@ export const OpenAICompatible = ({
@@ -408,7 +408,7 @@ export const OpenAICompatible = ({
@@ -432,7 +432,7 @@ export const OpenAICompatible = ({
@@ -478,7 +478,7 @@ export const OpenAICompatible = ({
@@ -522,7 +522,7 @@ export const OpenAICompatible = ({
@@ -567,7 +567,7 @@ export const OpenAICompatible = ({ content={t("settings:providers.customModel.pricing.cacheReads.description")}>
@@ -609,7 +609,7 @@ export const OpenAICompatible = ({ content={t("settings:providers.customModel.pricing.cacheWrites.description")}>
diff --git a/webview-ui/src/components/settings/providers/Requesty.tsx b/webview-ui/src/components/settings/providers/Requesty.tsx index 82e4ef8e42..a9b5911a55 100644 --- a/webview-ui/src/components/settings/providers/Requesty.tsx +++ b/webview-ui/src/components/settings/providers/Requesty.tsx @@ -1,5 +1,6 @@ import { useCallback, useEffect, useState } from "react" -import { VSCodeCheckbox, VSCodeTextField } from "@vscode/webview-ui-toolkit/react" +import { VSCodeTextField } from "@vscode/webview-ui-toolkit/react" +import { Checkbox } from "@/components/ui/checkbox" import { type ProviderSettings, type OrganizationAllowList, requestyDefaultModelId } from "@roo-code/types" @@ -100,18 +101,20 @@ export const Requesty = ({ )} - { - const isChecked = e.target.checked === true - if (!isChecked) { - setApiConfigurationField("requestyBaseUrl", undefined) - } +
+ { + const isChecked = checked === true + if (!isChecked) { + setApiConfigurationField("requestyBaseUrl", undefined) + } - setRequestyEndpointSelected(isChecked) - }}> - {t("settings:providers.requestyUseCustomBaseUrl")} - + setRequestyEndpointSelected(isChecked) + }} + /> + {t("settings:providers.requestyUseCustomBaseUrl")} +
{requestyEndpointSelected && ( { remoteControlEnabled: false, taskSyncEnabled: false, featureRoomoteControlEnabled: false, + fontSizeMultiplier: 1.0, } const prevState: ExtensionState = { ...baseState, apiConfiguration: { modelMaxTokens: 1234, modelMaxThinkingTokens: 123 }, experiments: {} as Record, + fontSizeMultiplier: 1.0, } const newState: ExtensionState = { @@ -236,6 +238,7 @@ describe("mergeExtensionState", () => { imageGeneration: false, runSlashCommand: false, } as Record, + fontSizeMultiplier: 1.0, } const result = mergeExtensionState(prevState, newState) diff --git a/webview-ui/src/index.css b/webview-ui/src/index.css index 6f23892ced..c4f8f1ea3f 100644 --- a/webview-ui/src/index.css +++ b/webview-ui/src/index.css @@ -23,12 +23,12 @@ @plugin "tailwindcss-animate"; @theme { - --font-display: var(--vscode-font-family); - - --text-xs: calc(var(--vscode-font-size) * 0.85); - --text-sm: calc(var(--vscode-font-size) * 0.9); - --text-base: var(--vscode-font-size); - --text-lg: calc(var(--vscode-font-size) * 1.1); + --text-xs: calc(var(--vscode-font-size) * 0.85 * var(--roo-font-size-multiplier, 1)); + --text-sm: calc(var(--vscode-font-size) * 0.9 * var(--roo-font-size-multiplier, 1)); + --text-base: calc(var(--vscode-font-size) * var(--roo-font-size-multiplier, 1)); + --text-lg: calc(var(--vscode-font-size) * 1.1 * var(--roo-font-size-multiplier, 1)); + --text-xl: calc(var(--vscode-font-size) * 1.2 * var(--roo-font-size-multiplier, 1)); + --text-2xl: calc(var(--vscode-font-size) * 1.4 * var(--roo-font-size-multiplier, 1)); --color-background: var(--background); --color-foreground: var(--foreground); @@ -147,6 +147,9 @@ @layer base { :root { + --roo-font-size-multiplier: 1; + --type-ramp-base-font-size: calc(var(--vscode-font-size) * var(--roo-font-size-multiplier, 1)) !important; + --background: var(--vscode-editor-background); --foreground: var(--vscode-editor-foreground); --card: var(--vscode-editor-background); @@ -230,6 +233,7 @@ html { body { margin: 0; line-height: 1.25; + font-size: calc(var(--vscode-font-size) * var(--roo-font-size-multiplier, 1)); } body.scrollable, @@ -339,7 +343,7 @@ body:focus-within .code-block-scrollable { display: block; color: var(--vscode-foreground); cursor: pointer; - font-size: var(--vscode-font-size); + font-size: calc(var(--vscode-font-size) * var(--roo-font-size-multiplier, 1)); line-height: normal; margin-bottom: 2px; }