Fix vertical scrolling (fixes #18858)

src/vs/workbench/parts/walkThrough/electron-browser/walkThroughPart.ts

@@ -64,6 +64,7 @@ export class WalkThroughPart extends BaseEditor {
 	private content: HTMLDivElement;
 	private scrollbar: DomScrollableElement;
 	private editorFocus: IContextKey<boolean>;
+	private size: Dimension;
 
 	constructor(
 		@ITelemetryService telemetryService: ITelemetryService,
@@ -170,13 +171,10 @@ export class WalkThroughPart extends BaseEditor {
 		return uri.with({ query: JSON.stringify(query) });
 	}
 
-	layout({ width, height }: Dimension): void {
-		$(this.content).style({ height: `${height}px`, width: `${width}px` });
-		const innerContent = this.content.firstElementChild;
-		if (innerContent) {
-			const classList = innerContent.classList;
-			classList[height <= 690 ? 'add' : 'remove']('max-height-690px');
-		}
+	layout(size: Dimension): void {
+		this.size = size;
+		$(this.content).style({ height: `${size.height}px`, width: `${size.width}px` });
+		this.updateSizeClasses();
 		this.contentDisposables.forEach(disposable => {
 			if (disposable instanceof CodeEditor) {
 				disposable.layout();
@@ -185,6 +183,14 @@ export class WalkThroughPart extends BaseEditor {
 		this.scrollbar.scanDomNode();
 	}
 
+	private updateSizeClasses() {
+		const innerContent = this.content.firstElementChild;
+		if (this.size && innerContent) {
+			const classList = innerContent.classList;
+			classList[this.size.height <= 690 ? 'add' : 'remove']('max-height-690px');
+		}
+	}
+
 	focus(): void {
 		let active = document.activeElement;
 		while (active && active !== this.content) {
@@ -240,6 +246,7 @@ export class WalkThroughPart extends BaseEditor {
 				const content = model.main.textEditorModel.getLinesContent().join('\n');
 				if (strings.endsWith(input.getResource().path, '.html')) {
 					this.content.innerHTML = content;
+					this.updateSizeClasses();
 					this.decorateContent();
 					if (input.onReady) {
 						input.onReady(this.content.firstElementChild as HTMLElement);
@@ -316,6 +323,7 @@ export class WalkThroughPart extends BaseEditor {
 						});
 					}));
 				});
+				this.updateSizeClasses();
 				if (input.onReady) {
 					input.onReady(innerContent);
 				}

src/vs/workbench/parts/welcomePage/electron-browser/welcomePage.css

@@ -3,11 +3,15 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
+.monaco-workbench > .part.editor > .content .welcomePageContainer {
+	align-items: center;
+	display: flex;
+	justify-content: center;
+	min-width: 100%;
+	min-height: 100%;
+}
+
 .monaco-workbench > .part.editor > .content .welcomePage {
-	position: absolute;
-	top: 50%;
-	left: 50%;
-	transform: translate(-50%, -50%);
 	width: 90%;
 	max-width: 1200px;
 	font-size: 10px;
@@ -241,7 +245,7 @@
 	outline-offset: -5px;
 }
 
-.monaco-workbench > .part.editor > .content .welcomePage.max-height-690px .title {
+.monaco-workbench > .part.editor > .content .welcomePageContainer.max-height-690px .title {
 	display: none;
 }
 

src/vs/workbench/parts/welcomePage/electron-browser/welcomePage.html

-<div class="welcomePage">
+<div class="welcomePageContainer">
+	<div class="welcomePage">
 		<div class="title">
 			<h1>Visual Studio Code</h1>
 			<p class="subtitle">Editing evolved</p>
@@ -44,4 +45,5 @@
 				</ul>
 			</div>
 		</div>
+	</div>
 </div>
\ No newline at end of file