development/vscode
development/vscode
1
0
Fork 0
mirror of https://github.com/Microsoft/vscode synced 2024-08-28 13:29:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

git extension icon decorations

Browse source
This commit is contained in:
Joao Moreno 2016-12-01 18:02:19 +01:00
parent fbeaa5e685
commit 251b65688c
11 changed files with 98 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
extensions/git/resources/icons/light/status-added.svg Normal file
View file

@ -0,0 +1,6 @@
<svg width="14px" height="14px" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<rect fill="#2d883e" x="0" y="0" width="100" height="100" rx="35" ry="35"/>
<text x="50" y="75" font-size="75" text-anchor="middle" style="font-family: Menlo, Monaco, Consolas, &quot;Droid Sans Mono&quot;, &quot;Inconsolata&quot;, &quot;Courier New&quot;, monospace, &quot;Droid Sans Fallback&quot;;" fill="white">
A
</text>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 431 B

6
extensions/git/resources/icons/light/status-conflict.svg Normal file
View file

@ -0,0 +1,6 @@
<svg width="14px" height="14px" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<rect fill="#9B4F96" x="0" y="0" width="100" height="100" rx="35" ry="35"/>
<text x="50" y="75" font-size="75" text-anchor="middle" style="font-family: Menlo, Monaco, Consolas, &quot;Droid Sans Mono&quot;, &quot;Inconsolata&quot;, &quot;Courier New&quot;, monospace, &quot;Droid Sans Fallback&quot;;" fill="white">
C
</text>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 431 B

6
extensions/git/resources/icons/light/status-copied.svg Normal file
View file

@ -0,0 +1,6 @@
<svg width="14px" height="14px" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<rect fill="#682079" x="0" y="0" width="100" height="100" rx="35" ry="35"/>
<text x="50" y="75" font-size="75" text-anchor="middle" style="font-family: Menlo, Monaco, Consolas, &quot;Droid Sans Mono&quot;, &quot;Inconsolata&quot;, &quot;Courier New&quot;, monospace, &quot;Droid Sans Fallback&quot;;" fill="white">
C
</text>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 431 B

6
extensions/git/resources/icons/light/status-deleted.svg Normal file
View file

@ -0,0 +1,6 @@
<svg width="14px" height="14px" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<rect fill="#B9131A" x="0" y="0" width="100" height="100" rx="35" ry="35"/>
<text x="50" y="75" font-size="75" text-anchor="middle" style="font-family: Menlo, Monaco, Consolas, &quot;Droid Sans Mono&quot;, &quot;Inconsolata&quot;, &quot;Courier New&quot;, monospace, &quot;Droid Sans Fallback&quot;;" fill="white">
D
</text>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 431 B

6
extensions/git/resources/icons/light/status-ignored.svg Normal file
View file

@ -0,0 +1,6 @@
<svg width="14px" height="14px" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<rect fill="#969696" x="0" y="0" width="100" height="100" rx="35" ry="35"/>
<text x="50" y="75" font-size="75" text-anchor="middle" style="font-family: Menlo, Monaco, Consolas, &quot;Droid Sans Mono&quot;, &quot;Inconsolata&quot;, &quot;Courier New&quot;, monospace, &quot;Droid Sans Fallback&quot;;" fill="white">
I
</text>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 431 B

6
extensions/git/resources/icons/light/status-modified.svg Normal file
View file

@ -0,0 +1,6 @@
<svg width="14px" height="14px" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<rect fill="#007ACC" x="0" y="0" width="100" height="100" rx="35" ry="35"/>
<text x="50" y="75" font-size="75" text-anchor="middle" style="font-family: Menlo, Monaco, Consolas, &quot;Droid Sans Mono&quot;, &quot;Inconsolata&quot;, &quot;Courier New&quot;, monospace, &quot;Droid Sans Fallback&quot;;" fill="white">
M
</text>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 431 B

6
extensions/git/resources/icons/light/status-renamed.svg Normal file
View file

@ -0,0 +1,6 @@
<svg width="14px" height="14px" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<rect fill="#4668C5" x="0" y="0" width="100" height="100" rx="35" ry="35"/>
<text x="50" y="75" font-size="75" text-anchor="middle" style="font-family: Menlo, Monaco, Consolas, &quot;Droid Sans Mono&quot;, &quot;Inconsolata&quot;, &quot;Courier New&quot;, monospace, &quot;Droid Sans Fallback&quot;;" fill="white">
R
</text>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 431 B

6
extensions/git/resources/icons/light/status-untracked.svg Normal file
View file

@ -0,0 +1,6 @@
<svg width="14px" height="14px" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<rect fill="#6C6C6C" x="0" y="0" width="100" height="100" rx="35" ry="35"/>
<text x="50" y="75" font-size="75" text-anchor="middle" style="font-family: Menlo, Monaco, Consolas, &quot;Droid Sans Mono&quot;, &quot;Inconsolata&quot;, &quot;Courier New&quot;, monospace, &quot;Droid Sans Fallback&quot;;" fill="white">
U
</text>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 431 B

59
extensions/git/src/scmProvider.ts
View file

@ -21,6 +21,17 @@ function getIconUri(iconName: string, theme: Theme): Uri {
return Uri.file(path.join(iconsRootPath, themeName, `${iconName}.svg`));
}
const Icons = {
Modified: getIconUri('status-modified', Theme.Light),
Added: getIconUri('status-added', Theme.Light),
Deleted: getIconUri('status-deleted', Theme.Light),
Renamed: getIconUri('status-renamed', Theme.Light),
Copied: getIconUri('status-copied', Theme.Light),
Untracked: getIconUri('status-untracked', Theme.Light),
Ignored: getIconUri('status-ignored', Theme.Light),
Conflict: getIconUri('status-conflict', Theme.Light),
};
enum Status {
INDEX_MODIFIED,
INDEX_ADDED,
@ -46,21 +57,45 @@ class Resource implements SCMResource {
get uri(): Uri { return this._uri; }
get decorations(): SCMResourceDecorations {
let iconPath: Uri | undefined;
let strikeThrough = false;
private get iconPath(): Uri | undefined {
switch (this.type) {
case Status.MODIFIED:
iconPath = getIconUri('refresh', Theme.Light);
break;
case Status.DELETED:
iconPath = getIconUri('refresh', Theme.Light);
strikeThrough = true;
break;
case Status.INDEX_MODIFIED: return Icons.Modified;
case Status.MODIFIED: return Icons.Modified;
case Status.INDEX_ADDED: return Icons.Added;
case Status.INDEX_DELETED: return Icons.Deleted;
case Status.DELETED: return Icons.Deleted;
case Status.INDEX_RENAMED: return Icons.Renamed;
case Status.INDEX_COPIED: return Icons.Copied;
case Status.UNTRACKED: return Icons.Untracked;
case Status.IGNORED: return Icons.Ignored;
case Status.BOTH_DELETED: return Icons.Conflict;
case Status.ADDED_BY_US: return Icons.Conflict;
case Status.DELETED_BY_THEM: return Icons.Conflict;
case Status.ADDED_BY_THEM: return Icons.Conflict;
case Status.DELETED_BY_US: return Icons.Conflict;
case Status.BOTH_ADDED: return Icons.Conflict;
case Status.BOTH_MODIFIED: return Icons.Conflict;
default: return void 0;
}
}
return { iconPath, strikeThrough };
private get strikeThrough(): boolean {
switch (this.type) {
case Status.DELETED:
case Status.BOTH_DELETED:
case Status.DELETED_BY_THEM:
case Status.DELETED_BY_US:
return true;
default:
return false;
}
}
get decorations(): SCMResourceDecorations {
return {
iconPath: this.iconPath,
strikeThrough: this.strikeThrough
};
}
constructor(private _uri: Uri, private type: any) {

1
src/vs/workbench/parts/scm/browser/media/scmViewlet.css
View file

@ -68,6 +68,7 @@
height: 100%;
background-repeat: no-repeat;
background-position: 50% 50%;
margin-right: 6px;
}
.scm-viewlet .monaco-list-row > .resource > .actions .action-label,

4
src/vs/workbench/parts/scm/browser/scmViewlet.ts
View file

@ -102,9 +102,9 @@ class ResourceRenderer implements IRenderer<ISCMResource, ResourceTemplate> {
renderTemplate(container: HTMLElement): ResourceTemplate {
const element = append(container, $('.resource'));
const decorationIcon = append(element, $('.decoration-icon'));
const name = append(element, $('.name'));
const fileLabel = this.instantiationService.createInstance(FileLabel, name, void 0);
const decorationIcon = append(element, $('.decoration-icon'));
const actionsContainer = append(element, $('.actions'));
const actionBar = new ActionBar(actionsContainer, { actionItemProvider: this.actionItemProvider });
@ -120,7 +120,7 @@ class ResourceRenderer implements IRenderer<ISCMResource, ResourceTemplate> {
if (resource.decorations.icon) {
template.decorationIcon.style.backgroundImage = `url('${resource.decorations.icon}')`;
} else {
delete template.decorationIcon.style.backgroundImage;
template.decorationIcon.style.backgroundImage = '';
}
}