maxmustermann/vscode
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

finetune extension editor

Browse source
This commit is contained in:
Sandeep Somavarapu 2021-07-17 09:37:07 +02:00
parent ac90351320
commit f491d5ce97
2 changed files with 26 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
src/vs/workbench/contrib/extensions/browser/extensionEditor.ts
View file

@ -132,7 +132,6 @@ interface IExtensionEditorTemplate {
iconContainer: HTMLElement;
icon: HTMLImageElement;
name: HTMLElement;
identifier: HTMLElement;
preview: HTMLElement;
builtin: HTMLElement;
version: HTMLElement;
@ -213,7 +212,7 @@ export class ExtensionEditor extends EditorPane {
const details = append(header, $('.details'));
const title = append(details, $('.title'));
const name = append(title, $('span.name.clickable', { title: localize('name', "Extension name"), role: 'heading', tabIndex: 0 }));
const identifier = append(title, $('span.identifier', { title: localize('extension id', "Extension identifier") }));
const version = append(title, $('code.version', { title: localize('extension version', "Extension Version") }));
const preview = append(title, $('span.preview', { title: localize('preview', "Preview") }));
preview.textContent = localize('preview', "Preview");
@ -225,7 +224,6 @@ export class ExtensionEditor extends EditorPane {
const publisher = append(append(subtitle, $('.subtitle-entry')), $('span.publisher.clickable', { title: localize('publisher', "Publisher name"), tabIndex: 0 }));
const installCount = append(append(subtitle, $('.subtitle-entry')), $('span.install', { title: localize('install count', "Install count"), tabIndex: 0 }));
const rating = append(append(subtitle, $('.subtitle-entry')), $('span.rating.clickable', { title: localize('rating', "Rating"), tabIndex: 0 }));
const version = append(append(subtitle, $('.subtitle-entry')), $('span.version', { title: localize('version', 'Version'), tabIndex: 0 }));
const description = append(details, $('.description'));
@ -272,7 +270,6 @@ export class ExtensionEditor extends EditorPane {
header,
icon,
iconContainer,
identifier,
version,
ignoreActionbar,
installCount,
@ -334,7 +331,7 @@ export class ExtensionEditor extends EditorPane {
template.icon.src = extension.iconUrl;
template.name.textContent = extension.displayName;
template.identifier.textContent = extension.identifier.id;
template.version.textContent = `v${extension.version}`;
template.preview.style.display = extension.preview ? 'inherit' : 'none';
template.builtin.style.display = extension.isBuiltin ? 'inherit' : 'none';
@ -367,8 +364,6 @@ export class ExtensionEditor extends EditorPane {
template.rating.parentElement?.classList.toggle('hide', !extension.url);
template.rating.classList.toggle('clickable', !!extension.url);
template.version.textContent = `v${extension.version}`;
if (extension.url) {
this.transientDisposables.add(this.onClick(template.name, () => this.openerService.open(URI.parse(extension.url!))));
this.transientDisposables.add(this.onClick(template.rating, () => this.openerService.open(URI.parse(`${extension.url}&ssr=false#review-details`))));
@ -786,7 +781,6 @@ export class ExtensionEditor extends EditorPane {
const resources: [string, URI][] = [];
if (extension.url) {
resources.push([localize('Marketplace', "Marketplace"), URI.parse(extension.url)]);
resources.push([localize('Reviews', "Rating & Review"), URI.parse(`${extension.url}&ssr=false#review-details`)]);
}
if (extension.repository) {
resources.push([localize('repository', "Repository"), URI.parse(extension.repository)]);
@ -806,22 +800,26 @@ export class ExtensionEditor extends EditorPane {
private renderMoreInfo(container: HTMLElement, extension: IExtension): void {
const gallery = extension.gallery;
if (!gallery) {
return;
}
const moreInfoContainer = append(container, $('.more-info-container'));
append(moreInfoContainer, $('.additional-details-title', undefined, localize('more info', "More Info")));
const moreInfo = append(moreInfoContainer, $('.more-info'));
if (gallery) {
append(moreInfo,
$('.more-info-entry', undefined,
$('span', undefined, localize('release date', "Released on")),
$('span', undefined, new Date(gallery.releaseDate).toLocaleString())
),
$('.more-info-entry', undefined,
$('span', undefined, localize('last updated', "Last updated")),
$('span', undefined, new Date(gallery.lastUpdated).toLocaleString())
)
);
}
append(moreInfo,
$('.more-info-entry', undefined,
$('span', undefined, localize('release date', "Released on")),
$('span', undefined, new Date(gallery.releaseDate).toLocaleString())
),
$('.more-info-entry', undefined,
$('span', undefined, localize('last updated', "Last updated")),
$('span', undefined, new Date(gallery.lastUpdated).toLocaleString())
)
);
$('span', undefined, localize('id', "Identifier")),
$('code', undefined, extension.identifier.id)
));
}
private openChangelog(template: IExtensionEditorTemplate, token: CancellationToken): Promise<IActiveElement | null> {

18
src/vs/workbench/contrib/extensions/browser/media/extensionEditor.css
View file

@ -75,12 +75,8 @@
white-space: nowrap;
}
.extension-editor > .header > .details > .title > .identifier {
.extension-editor > .header > .details > .title > .version {
margin-left: 10px;
font-size: 14px;
background: rgba(173, 173, 173, 0.31);
padding: 0px 4px;
border-radius: 4px;
user-select: text;
-webkit-user-select: text;
white-space: nowrap;
@ -365,14 +361,18 @@
display: flex;
}
.extension-editor > .body > .content > .details > .additional-details-container .more-info-container > .more-info > .more-info-entry span:first-child {
.extension-editor > .body > .content > .details > .additional-details-container .more-info-container > .more-info > .more-info-entry :first-child {
flex: 0.4
}
.extension-editor > .body > .content > .details > .additional-details-container .more-info-container > .more-info > .more-info-entry span:last-child {
.extension-editor > .body > .content > .details > .additional-details-container .more-info-container > .more-info > .more-info-entry :last-child {
flex: 0.6
}
.extension-editor > .body > .content > .details > .additional-details-container .more-info-container > .more-info > .more-info-entry code {
background-color: transparent;
}
.extension-editor > .body > .content > .details > .readme-container > .extension-pack-readme {
height: 100%;
}
@ -495,7 +495,7 @@
margin: 0px;
}
.extension-editor > .body > .content code:not(:empty) {
.extension-editor code:not(:empty) {
font-family: var(--monaco-monospace-font);
font-size: 90%;
background-color: rgba(128, 128, 128, 0.17);
@ -632,6 +632,6 @@
margin: 5px;
}
.extension-editor > .body > .content .runtime-status .message-entry .codicon{
.extension-editor > .body > .content .runtime-status .message-entry .codicon {
padding-right: 2px;
}