ux: improve responsiveness on small widths for auto-approve button

- + Add Russian i18n string

Author: veryevilhuman

webview-ui/src/components/chat/AutoApproveDropdown.tsx

@@ -173,24 +173,35 @@ export const AutoApproveDropdown = ({ disabled = false, triggerClassName = "" }:
 						"inline-flex items-center gap-1.5 relative whitespace-nowrap px-1.5 py-1 text-xs",
 						"bg-transparent border border-[rgba(255,255,255,0.08)] rounded-md text-vscode-foreground",
 						"transition-all duration-150 focus:outline-none focus-visible:ring-1 focus-visible:ring-vscode-focusBorder focus-visible:ring-inset",
+						"max-[400px]:shrink-0",
 						disabled
 							? "opacity-50 cursor-not-allowed"
 							: "opacity-90 hover:opacity-100 hover:bg-[rgba(255,255,255,0.03)] hover:border-[rgba(255,255,255,0.15)] cursor-pointer",
 						triggerClassName,
 					)}>
-					{!effectiveAutoApprovalEnabled ? (
-						<X className="size-3 flex-shrink-0" />
-					) : (
-						<CheckCheck className="size-3 flex-shrink-0" />
-					)}
+					<CheckCheck className="min-[400px]:hidden size-3 flex-shrink-0" />
+					<span className="max-[400px]:hidden">
+						{!effectiveAutoApprovalEnabled ? (
+							<X className="size-3 flex-shrink-0" />
+						) : (
+							<CheckCheck className="size-3 flex-shrink-0" />
+						)}
+					</span>
 
-					<span className="truncate min-w-0">
+					<span className="min-[400px]:inline hidden truncate min-w-0">
 						{!effectiveAutoApprovalEnabled
 							? t("chat:autoApprove.triggerLabelOff")
 							: enabledCount === totalCount
 								? t("chat:autoApprove.triggerLabelAll")
 								: t("chat:autoApprove.triggerLabel", { count: enabledCount })}
 					</span>
+					<span className="min-[400px]:hidden min-w-0">
+						{!effectiveAutoApprovalEnabled
+							? t("chat:autoApprove.triggerLabelOffShort")
+							: enabledCount === totalCount
+								? t("chat:autoApprove.triggerLabelAll")
+								: enabledCount}
+					</span>
 				</PopoverTrigger>
 			</StandardTooltip>
 			<PopoverContent

webview-ui/src/i18n/locales/en/chat.json

@@ -284,7 +284,8 @@
 		"triggerLabel_zero": "0 auto-approve",
 		"triggerLabel_one": "1 auto-approved",
 		"triggerLabel_other": "{{count}} auto-approved",
-		"triggerLabelAll": "YOLO"
+		"triggerLabelAll": "YOLO",
+		"triggerLabelOffShort": "Off"
 	},
 	"announcement": {
 		"title": "🎉 Roo Code {{version}} Released",