Microsoft/vscode
1
0
Fork 0
mirror of https://github.com/microsoft/vscode.git synced 2026-05-08 17:19:48 +01:00
Code Issues Packages Projects Releases Wiki Activity

icons: for when tabs are disabled

Browse Source
This commit is contained in:
Benjamin Pasero
2016-09-20 15:54:39 +02:00
parent c64b992a48
commit 4851c57e7e
6 changed files with 27 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/vs/base/browser/ui/iconLabel/iconLabel.ts
+1 -1
View File
@@ -33,7 +33,7 @@ export class IconLabel {
return this.domNode;
}
public setValue(label: string, description?: string, options?: IIconLabelOptions): void {
public setValue(label?: string, description?: string, options?: IIconLabelOptions): void {
this.labelNode.textContent = label || '';
this.descriptionNode.textContent = description || '';
src/vs/workbench/browser/parts/editor/editorLabel.ts
+7
View File
@@ -50,6 +50,13 @@ export class EditorLabel extends IconLabel {
this.render();
}
public clear(): void {
this.label = void 0;
this.options = void 0;
this.setValue();
}
private render(): void {
if (!this.label) {
return;
src/vs/workbench/browser/parts/editor/media/notabstitle.css
+2 -3
View File
@@ -38,11 +38,10 @@
text-overflow: ellipsis;
position: relative;
padding-left: 2px;
font-style: italic;
}
.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.pinned .title-label {
font-style: normal;
.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .monaco-icon-label::before {
height: 35px; /* tweak the icon size of the editor labels when icons are enabled */
}
/* Title Actions */
src/vs/workbench/browser/parts/editor/media/tabstitle.css
+5 -1
View File
@@ -3,7 +3,7 @@
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
/* Title decoration */
/* Title Container */
.vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.tabs {
background: #F3F3F3;
@@ -143,6 +143,10 @@
margin-bottom: auto;
}
.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .monaco-icon-label::before {
height: 16px; /* tweak the icon size of the editor labels when icons are enabled */
}
.vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .tab-label {
opacity: 0.7 !important;
}
src/vs/workbench/browser/parts/editor/media/titlecontrol.css
-23
View File
@@ -11,11 +11,6 @@
flex: 1;
}
.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .monaco-icon-label::before,
.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .monaco-icon-label::before {
height: 16px; /* tweak the icon size of the editor labels when icons are enabled */
}
.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .title-label a,
.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .tab-label a {
text-decoration: none;
@@ -48,24 +43,6 @@
color: white;
}
/* Title Description */
.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .tab-label span,
.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .title-label span {
margin-left: 0.5em;
font-size: 0.9em;
}
.vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .tab-label span,
.vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .title-label span {
color: rgba(108, 108, 108, 0.7);
}
.vs-dark .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .tabs-container > .tab .tab-label span,
.vs-dark .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .title-label span {
color: rgba(204, 204, 204, 0.7);
}
/* Title Actions */
.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .title-actions .action-label,
src/vs/workbench/browser/parts/editor/noTabsTitleControl.ts
+12 -34
View File
@@ -7,15 +7,15 @@
import 'vs/css!./media/notabstitle';
import errors = require('vs/base/common/errors');
import {IEditorGroup} from 'vs/workbench/common/editor';
import {IEditorGroup, getResource} from 'vs/workbench/common/editor';
import DOM = require('vs/base/browser/dom');
import {TitleControl} from 'vs/workbench/browser/parts/editor/titleControl';
import {EditorLabel} from 'vs/workbench/browser/parts/editor/editorLabel';
export class NoTabsTitleControl extends TitleControl {
private titleContainer: HTMLElement;
private titleLabel: HTMLElement;
private titleDecoration: HTMLElement;
private titleDescription: HTMLElement;
private editorLabel: EditorLabel;
public setContext(group: IEditorGroup): void {
super.setContext(group);
@@ -27,6 +27,7 @@ export class NoTabsTitleControl extends TitleControl {
super.create(parent);
this.titleContainer = parent;
DOM.addClass(this.titleContainer, 'show-file-icons');
// Pin on double click
this.toDispose.push(DOM.addDisposableListener(this.titleContainer, DOM.EventType.DBLCLICK, (e: MouseEvent) => this.onTitleDoubleClick(e)));
@@ -39,21 +40,10 @@ export class NoTabsTitleControl extends TitleControl {
DOM.addClass(this.titleDecoration, 'title-decoration');
this.titleContainer.appendChild(this.titleDecoration);
// Left Title Label & Description
const labelContainer = document.createElement('div');
DOM.addClass(labelContainer, 'title-label');
this.titleLabel = document.createElement('a');
labelContainer.appendChild(this.titleLabel);
this.titleDescription = document.createElement('span');
labelContainer.appendChild(this.titleDescription);
// Detect title label & description click
this.toDispose.push(DOM.addDisposableListener(this.titleLabel, DOM.EventType.CLICK, (e: MouseEvent) => this.onTitleLabelClick(e)));
this.toDispose.push(DOM.addDisposableListener(this.titleDescription, DOM.EventType.CLICK, (e: MouseEvent) => this.onTitleLabelClick(e)));
this.titleContainer.appendChild(labelContainer);
// Editor Label
this.editorLabel = this.instantiationService.createInstance(EditorLabel, this.titleContainer);
this.toDispose.push(this.editorLabel);
this.toDispose.push(DOM.addDisposableListener(this.editorLabel.getHTMLElement(), DOM.EventType.CLICK, (e: MouseEvent) => this.onTitleLabelClick(e)));
// Right Actions Container
const actionsContainer = document.createElement('div');
@@ -109,9 +99,7 @@ export class NoTabsTitleControl extends TitleControl {
const group = this.context;
const editor = group && group.activeEditor;
if (!editor) {
this.titleLabel.innerText = '';
this.titleDescription.innerText = '';
this.editorLabel.clear();
this.clearEditorActionsToolbar();
return; // return early if we are being closed
@@ -120,13 +108,6 @@ export class NoTabsTitleControl extends TitleControl {
const isPinned = group.isPinned(group.activeEditor);
const isActive = this.stacks.isActive(group);
// Pinned state
if (isPinned) {
DOM.addClass(this.titleContainer, 'pinned');
} else {
DOM.removeClass(this.titleContainer, 'pinned');
}
// Activity state
if (isActive) {
DOM.addClass(this.titleContainer, 'active');
@@ -134,7 +115,8 @@ export class NoTabsTitleControl extends TitleControl {
DOM.removeClass(this.titleContainer, 'active');
}
// Editor Title
// Editor Label
const resource = getResource(editor);
const name = editor.getName() || '';
const description = isActive ? (editor.getDescription() || '') : '';
let verboseDescription = editor.getDescription(true) || '';
@@ -142,11 +124,7 @@ export class NoTabsTitleControl extends TitleControl {
verboseDescription = ''; // dont repeat what is already shown
}
this.titleLabel.innerText = name;
this.titleLabel.title = verboseDescription;
this.titleDescription.innerText = description;
this.titleDescription.title = verboseDescription;
this.editorLabel.setLabel({ name, description, resource}, { title: verboseDescription, italic: !isPinned, extraClasses: ['title-label'] });
// Editor Decoration
if (editor.isDirty()) {