feat: update tooltip component to match native VSCode tooltip shadow styling (#7457)

Co-authored-by: Roo Code <[email protected]>
Co-authored-by: cte <[email protected]>

Author: 3 people

webview-ui/src/components/ui/tooltip.tsx

@@ -31,6 +31,7 @@ function TooltipContent({
 				className={cn(
 					"bg-vscode-editorHoverWidget-background outline outline-vscode-editorHoverWidget-border text-vscode-editorHoverWidget-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-sm px-2 py-1 text-xs text-balance",
 					"max-w-[300px] break-words",
+					"shadow-[0_2px_8px_var(--color-vscode-widget-shadow)]",
 					className,
 				)}
 				{...props}>

webview-ui/src/index.css

@@ -131,6 +131,7 @@
 	--color-vscode-inputValidation-infoBorder: var(--vscode-inputValidation-infoBorder);
 
 	--color-vscode-widget-border: var(--vscode-widget-border);
+	--color-vscode-widget-shadow: var(--vscode-widget-shadow);
 
 	--color-vscode-textLink-foreground: var(--vscode-textLink-foreground);