From b6e17e78cd045f01bae4afba9e43f0fcf5438efe Mon Sep 17 00:00:00 2001 From: Himanshu Date: Thu, 31 Oct 2024 18:41:06 +0530 Subject: [PATCH] improvements --- .../parts/editor/editorGroupWatermark.ts | 34 ++++++++--------- .../parts/editor/media/editorgroupview.css | 38 +++++++++++++++---- 2 files changed, 47 insertions(+), 25 deletions(-) diff --git a/src/vs/workbench/browser/parts/editor/editorGroupWatermark.ts b/src/vs/workbench/browser/parts/editor/editorGroupWatermark.ts index 20e2b9abdcb3b..c308bff332f28 100644 --- a/src/vs/workbench/browser/parts/editor/editorGroupWatermark.ts +++ b/src/vs/workbench/browser/parts/editor/editorGroupWatermark.ts @@ -202,6 +202,13 @@ export class EditorGroupWatermark extends Disposable { const openFolderButton = append(container, $('button.open-folder-button')); openFolderButton.textContent = localize('watermark.openFolder', "Open Folder"); + // Add click handler for Open Folder button + this._register(addDisposableListener(openFolderButton, EventType.CLICK, (e: MouseEvent) => { + e.preventDefault(); + e.stopPropagation(); + this.commandService.executeCommand('workbench.action.files.openFolder'); + })); + // Add recent list const recentList = append(container, $('.recent-list')); @@ -235,27 +242,22 @@ export class EditorGroupWatermark extends Disposable { windowOpenable = { workspaceUri: recent.workspace.configPath }; } - // Split the label into name and path const { name, parentPath } = splitRecentLabel(fullPath); - // Create the item content with name and path - const nameElement = append(itemElement, $('.name')); - nameElement.textContent = name; - + itemElement.textContent = name; if (parentPath) { - const pathElement = append(itemElement, $('.path')); - pathElement.textContent = parentPath; + append(itemElement, $('span.spacer')); + const pathSpan = append(itemElement, $('span.path')); + pathSpan.textContent = parentPath; } itemElement.title = fullPath; - - // Add click handler itemElement.style.cursor = 'pointer'; + this._register(addDisposableListener(itemElement, EventType.CLICK, async (e: MouseEvent) => { try { e.preventDefault(); e.stopPropagation(); - await this.hostService.openWindow([windowOpenable], { forceNewWindow: e.ctrlKey || e.metaKey, remoteAuthority: recent.remoteAuthority ?? null @@ -267,17 +269,15 @@ export class EditorGroupWatermark extends Disposable { }); // Add "More..." item - const moreItem = append(recentList, $('.recent-item.more-item')); + const moreItem = append(recentList, $('.more-item')); moreItem.textContent = localize('watermark.more', "More..."); - moreItem.title = localize('watermark.showMoreRecents', "Show All Recent Folders"); - moreItem.style.cursor = 'pointer'; - // Get keybinding for OpenRecentAction if available const keybinding = this.keybindingService.lookupKeybinding('workbench.action.openRecent')?.getLabel(); - if (keybinding) { - moreItem.title += ` (${keybinding})`; - } + moreItem.title = keybinding ? + localize('watermark.showMoreRecents', "Show All Recent Folders ({0})", keybinding) : + localize('watermark.showMoreRecents', "Show All Recent Folders"); + moreItem.style.cursor = 'pointer'; this._register(addDisposableListener(moreItem, EventType.CLICK, (e: MouseEvent) => { e.preventDefault(); e.stopPropagation(); diff --git a/src/vs/workbench/browser/parts/editor/media/editorgroupview.css b/src/vs/workbench/browser/parts/editor/media/editorgroupview.css index 0f264513520b0..7adec2f306b16 100644 --- a/src/vs/workbench/browser/parts/editor/media/editorgroupview.css +++ b/src/vs/workbench/browser/parts/editor/media/editorgroupview.css @@ -57,7 +57,8 @@ .monaco-workbench .part.editor > .content.auxiliary .editor-group-container.empty > .editor-group-watermark-no-workspace { display: flex; height: 100%; - max-width: 290px; + min-width: 500px; + max-width: 700px; margin: auto; flex-direction: column; align-items: center; @@ -77,6 +78,7 @@ border-radius: 2px; cursor: pointer; font-size: 13px; + margin-bottom: 20px; } .monaco-workbench .part.editor > .content .editor-group-container > .editor-group-watermark-no-workspace .open-folder-button:hover { @@ -85,26 +87,32 @@ .monaco-workbench .part.editor > .content .editor-group-container > .editor-group-watermark-no-workspace .recent-list { width: 100%; - max-width: 260px; + min-width: 260px; + max-width: 700px; color: var(--vscode-editorWatermark-foreground); opacity: 0.8; } .monaco-workbench .part.editor > .content .editor-group-container > .editor-group-watermark-no-workspace .recent-list .recent-item { - display: flex; - align-items: center; - gap: 4px; padding: 4px 0; + cursor: pointer; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .monaco-workbench .part.editor > .content .editor-group-container > .editor-group-watermark-no-workspace .recent-list .recent-item .path { opacity: 0.7; - margin-left: 4px; - font-size: 0.9em; +} + +.monaco-workbench .part.editor > .content .editor-group-container > .editor-group-watermark-no-workspace .recent-list .recent-item:hover { + color: var(--vscode-foreground); + opacity: 1; } .monaco-workbench .part.editor > .content .editor-group-container > .editor-group-watermark-no-workspace .recent-list .recent-item:hover .path { - opacity: 0.9; + color: var(--vscode-foreground); + opacity: 0.8; } .monaco-workbench .part.editor > .content .editor-group-container > .editor-group-watermark-workspace > .letterpress { @@ -239,6 +247,20 @@ } .monaco-workbench .part.editor > .content .editor-group-container > .editor-group-watermark-no-workspace .recent-list .more-item:hover { + color: var(--vscode-foreground); opacity: 1; } +/* When container is small, allow wrapping */ +@media (max-width: 700px) { + .monaco-workbench .part.editor > .content .editor-group-container > .editor-group-watermark-no-workspace .recent-list .recent-item { + white-space: normal; + word-break: break-all; + } +} + +.monaco-workbench .part.editor > .content .editor-group-container > .editor-group-watermark-no-workspace .recent-list .recent-item .spacer { + display: inline-block; + width: 10px; /* Adjust this value to increase/decrease spacing between name and path of recent items */ +} +