From d89fdcbfa8d0d9242b3fdb3528d792370380128a Mon Sep 17 00:00:00 2001
From: Aiday Marlen Kyzy <amarlenkyzy@microsoft.com>
Date: Fri, 6 Dec 2024 18:43:21 +0100
Subject: [PATCH] Removing bottom padding on editor hover  (#235507)

* almost there

* fixing padding, but now does not render correctly

* adding changes

* removing line

* renaming class

* taking into account borders
---
 .../hover/browser/contentHoverWidget.ts       | 29 +++++++++++--------
 src/vs/editor/contrib/hover/browser/hover.css | 10 +++----
 2 files changed, 21 insertions(+), 18 deletions(-)

diff --git a/src/vs/editor/contrib/hover/browser/contentHoverWidget.ts b/src/vs/editor/contrib/hover/browser/contentHoverWidget.ts
index ad27c1544d5..ffb8aaa9f11 100644
--- a/src/vs/editor/contrib/hover/browser/contentHoverWidget.ts
+++ b/src/vs/editor/contrib/hover/browser/contentHoverWidget.ts
@@ -19,7 +19,6 @@ import { Emitter } from '../../../../base/common/event.js';
 import { RenderedContentHover } from './contentHoverRendered.js';
 
 const HORIZONTAL_SCROLLING_BY = 30;
-const CONTAINER_HEIGHT_PADDING = 6;
 
 export class ContentHoverWidget extends ResizableContentWidget {
 
@@ -68,6 +67,7 @@ export class ContentHoverWidget extends ResizableContentWidget {
 
 		dom.append(this._resizableNode.domNode, this._hover.containerDomNode);
 		this._resizableNode.domNode.style.zIndex = '50';
+		this._resizableNode.domNode.className = 'monaco-resizable-hover';
 
 		this._register(this._editor.onDidLayoutChange(() => {
 			if (this.isVisible) {
@@ -117,9 +117,15 @@ export class ContentHoverWidget extends ResizableContentWidget {
 		return ContentHoverWidget._applyDimensions(containerDomNode, width, height);
 	}
 
+	private _setScrollableElementDimensions(width: number | string, height: number | string): void {
+		const scrollbarDomElement = this._hover.scrollbar.getDomNode();
+		return ContentHoverWidget._applyDimensions(scrollbarDomElement, width, height);
+	}
+
 	private _setHoverWidgetDimensions(width: number | string, height: number | string): void {
-		this._setContentsDomNodeDimensions(width, height);
 		this._setContainerDomNodeDimensions(width, height);
+		this._setScrollableElementDimensions(width, height);
+		this._setContentsDomNodeDimensions(width, height);
 		this._layoutContentWidget();
 	}
 
@@ -176,12 +182,11 @@ export class ContentHoverWidget extends ResizableContentWidget {
 		if (!availableSpace) {
 			return;
 		}
-		// Padding needed in order to stop the resizing down to a smaller height
-		let maximumHeight = CONTAINER_HEIGHT_PADDING;
+		const children = this._hover.contentsDomNode.children;
+		let maximumHeight = children.length - 1;
 		Array.from(this._hover.contentsDomNode.children).forEach((hoverPart) => {
 			maximumHeight += hoverPart.clientHeight;
 		});
-
 		return Math.min(availableSpace, maximumHeight);
 	}
 
@@ -209,7 +214,7 @@ export class ContentHoverWidget extends ResizableContentWidget {
 		const initialWidth = (
 			typeof this._contentWidth === 'undefined'
 				? 0
-				: this._contentWidth - 2 // - 2 for the borders
+				: this._contentWidth
 		);
 
 		if (overflowing || this._hover.containerDomNode.clientWidth < initialWidth) {
@@ -217,7 +222,7 @@ export class ContentHoverWidget extends ResizableContentWidget {
 			const horizontalPadding = 14;
 			return bodyBoxWidth - horizontalPadding;
 		} else {
-			return this._hover.containerDomNode.clientWidth + 2;
+			return this._hover.containerDomNode.clientWidth;
 		}
 	}
 
@@ -389,16 +394,16 @@ export class ContentHoverWidget extends ResizableContentWidget {
 
 	public onContentsChanged(): void {
 		this._removeConstraintsRenderNormally();
-		const containerDomNode = this._hover.containerDomNode;
+		const contentsDomNode = this._hover.contentsDomNode;
 
-		let height = dom.getTotalHeight(containerDomNode);
-		let width = dom.getTotalWidth(containerDomNode);
+		let height = dom.getTotalHeight(contentsDomNode);
+		let width = dom.getTotalWidth(contentsDomNode) + 2;
 		this._resizableNode.layout(height, width);
 
 		this._setHoverWidgetDimensions(width, height);
 
-		height = dom.getTotalHeight(containerDomNode);
-		width = dom.getTotalWidth(containerDomNode);
+		height = dom.getTotalHeight(contentsDomNode);
+		width = dom.getTotalWidth(contentsDomNode);
 		this._contentWidth = width;
 		this._updateMinimumWidth();
 		this._resizableNode.layout(height, width);
diff --git a/src/vs/editor/contrib/hover/browser/hover.css b/src/vs/editor/contrib/hover/browser/hover.css
index 958f1ee9cf4..b9da587c918 100644
--- a/src/vs/editor/contrib/hover/browser/hover.css
+++ b/src/vs/editor/contrib/hover/browser/hover.css
@@ -7,17 +7,15 @@
 	background-color: var(--vscode-editor-hoverHighlightBackground);
 }
 
-.monaco-editor .monaco-hover-content {
-	padding-right: 2px;
-	padding-bottom: 2px;
-	box-sizing: border-box;
+.monaco-editor .monaco-resizable-hover {
+	border: 1px solid var(--vscode-editorHoverWidget-border);
+	border-radius: 3px;
+	box-sizing: content-box;
 }
 
 .monaco-editor .monaco-hover {
 	color: var(--vscode-editorHoverWidget-foreground);
 	background-color: var(--vscode-editorHoverWidget-background);
-	border: 1px solid var(--vscode-editorHoverWidget-border);
-	border-radius: 3px;
 }
 
 .monaco-editor .monaco-hover a {