diff --git a/packages/core/src/browser/style/tree.css b/packages/core/src/browser/style/tree.css index 4eab49e281536..1a35eae426412 100644 --- a/packages/core/src/browser/style/tree.css +++ b/packages/core/src/browser/style/tree.css @@ -180,7 +180,7 @@ padding-left: var(--theia-welcomeView-horizontal-padding); } -.theia-TreeContainer .theia-WelcomeView > * { +.theia-TreeContainer .theia-WelcomeView>* { margin: var(--theia-welcomeView-elements-margin) 0; } diff --git a/packages/navigator/src/browser/open-editors-widget/navigator-open-editors-tree-model.ts b/packages/navigator/src/browser/open-editors-widget/navigator-open-editors-tree-model.ts index 1f62175e69039..7a086321cae4c 100644 --- a/packages/navigator/src/browser/open-editors-widget/navigator-open-editors-tree-model.ts +++ b/packages/navigator/src/browser/open-editors-widget/navigator-open-editors-tree-model.ts @@ -30,7 +30,7 @@ import { } from '@theia/core/lib/browser'; import { WorkspaceService } from '@theia/workspace/lib/browser'; import debounce = require('@theia/core/shared/lodash.debounce'); -import { DisposableCollection } from '@theia/core/lib/common'; +import { DisposableCollection, nls } from '@theia/core/lib/common'; import { FileStat } from '@theia/filesystem/lib/common/files'; export interface OpenEditorNode extends FileStatNode { @@ -157,7 +157,7 @@ export class OpenEditorsModel extends FileTreeModel { if (mainTabBars.length > 1) { mainTabBars.forEach((tabbar, index) => { const groupNumber = index + 1; - const newCaption = `GROUP ${groupNumber}`; + const newCaption = nls.localizeByDefault('Group {0}', groupNumber); const groupNode = { parent: undefined, id: `${OpenEditorsModel.GROUP_NODE_ID_PREFIX}:${groupNumber}`, diff --git a/packages/navigator/src/browser/open-editors-widget/navigator-open-editors-widget.tsx b/packages/navigator/src/browser/open-editors-widget/navigator-open-editors-widget.tsx index 96ce35f324801..5e5720d8b1f55 100644 --- a/packages/navigator/src/browser/open-editors-widget/navigator-open-editors-widget.tsx +++ b/packages/navigator/src/browser/open-editors-widget/navigator-open-editors-widget.tsx @@ -18,6 +18,7 @@ import * as React from '@theia/core/shared/react'; import { injectable, interfaces, Container, postConstruct, inject } from '@theia/core/shared/inversify'; import { ApplicationShell, + codicon, ContextMenuRenderer, defaultTreeProps, NavigatableWidget, @@ -46,6 +47,7 @@ export const OPEN_EDITORS_PROPS: TreeProps = { ...defaultTreeProps, virtualized: false, contextMenuPath: OPEN_EDITORS_CONTEXT_MENU, + leftPadding: 22 }; export interface OpenEditorsNodeRow extends TreeWidget.NodeRow { @@ -120,7 +122,7 @@ export class OpenEditorsWidget extends FileTreeWidget { {this.renderCaptionAffixes(node, props, 'captionSuffixes')} {this.renderTailDecorations(node, props)} {(this.isGroupNode(node) || this.isAreaNode(node)) && this.renderInteractables(node, props)} - ; + ; return React.createElement('div', attributes, content); } @@ -229,11 +231,11 @@ export class OpenEditorsWidget extends FileTreeWidget { return (
); } @@ -270,4 +272,11 @@ export class OpenEditorsWidget extends FileTreeWidget { this.applicationShell.activateWidget(node.widget.id); } } + + protected override getPaddingLeft(node: TreeNode): number { + if (node.id.startsWith(OpenEditorsModel.AREA_NODE_ID_PREFIX)) { + return 0; + } + return this.props.leftPadding; + } } diff --git a/packages/navigator/src/browser/open-editors-widget/open-editors.css b/packages/navigator/src/browser/open-editors-widget/open-editors.css index ad93d8e260d73..cfdd8ad2fb108 100644 --- a/packages/navigator/src/browser/open-editors-widget/open-editors.css +++ b/packages/navigator/src/browser/open-editors-widget/open-editors.css @@ -15,7 +15,7 @@ ********************************************************************************/ :root { - --theia-open-editors-icon-width: 16px; + --theia-open-editors-icon-width: 20px; } .theia-open-editors-widget .theia-caption-suffix { @@ -40,6 +40,7 @@ display: none; } +.theia-open-editors-widget .open-editors-node-row:not(.dirty) .theia-mod-selected .open-editors-prefix-icon.close, .theia-open-editors-widget .open-editors-node-row:hover .open-editors-prefix-icon.close { display: block; }