fix #12132

src/vs/workbench/parts/extensions/electron-browser/extensionEditor.ts

@@ -111,6 +111,7 @@ export class ExtensionEditor extends BaseEditor {
 
 	private icon: HTMLImageElement;
 	private name: HTMLElement;
+	private identifier: HTMLElement;
 	private license: HTMLElement;
 	private publisher: HTMLElement;
 	private installCount: HTMLElement;
@@ -164,6 +165,7 @@ export class ExtensionEditor extends BaseEditor {
 		const details = append(header, $('.details'));
 		const title = append(details, $('.title'));
 		this.name = append(title, $('span.name.clickable'));
+		this.identifier = append(title, $('span.identifier'));
 
 		const subtitle = append(details, $('.subtitle'));
 		this.publisher = append(subtitle, $('span.publisher.clickable'));
@@ -209,6 +211,7 @@ export class ExtensionEditor extends BaseEditor {
 		this.icon.src = extension.iconUrl;
 
 		this.name.textContent = extension.displayName;
+		this.identifier.textContent = `${extension.publisher}.${extension.name}`;
 		this.publisher.textContent = extension.publisherDisplayName;
 		this.description.textContent = extension.description;
 

src/vs/workbench/parts/extensions/electron-browser/media/extensionEditor.css

@@ -39,13 +39,24 @@
 }
 
 .extension-editor > .header > .details > .title > .name {
-	flex: 1;
+	flex: 0;
 	font-size: 26px;
 	line-height: 30px;
 	font-weight: 600;
 	white-space: nowrap;
 }
 
+.extension-editor > .header > .details > .title > .identifier {
+	margin-left: 10px;
+	font-size: 14px;
+	opacity: 0.6;
+	background: rgba(173, 173, 173, 0.51);
+	padding: 0px 4px;
+	border-radius: 4px;
+	user-select: text;
+	-webkit-user-select: text;
+}
+
 .extension-editor > .header > .details > .subtitle {
 	padding-top: 10px;
 	white-space: nowrap;