Settings editor - add "..." in a fixed position to indicate that a de…

…scription is expandable
ddyyff · May 21, 2018 · cdea1bd · cdea1bd
1 parent a5bfda7
commit cdea1bd
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 0 deletions.
diff --git a/src/vs/workbench/parts/preferences/browser/media/settingsEditor2.css b/src/vs/workbench/parts/preferences/browser/media/settingsEditor2.css
@@ -179,6 +179,16 @@
 	cursor: pointer;
 }
 
+.settings-editor > .settings-body > .settings-list-container .monaco-list-row.is-expandable:not(.is-expanded) .setting-item-description::after {
+	content: '…';
+	display: block;
+	height: 4px;
+	width: 8px;
+	position: absolute;
+	bottom: 16px;
+	left: 580px;
+}
+
 .settings-editor > .settings-body > .settings-list-container .monaco-list-row .setting-item-value {
 	display: flex;
 }

diff --git a/src/vs/workbench/parts/preferences/browser/settingsEditor2.ts b/src/vs/workbench/parts/preferences/browser/settingsEditor2.ts
@@ -754,6 +754,7 @@ interface ISettingItemTemplate extends IDisposableTemplate {
 	categoryElement: HTMLElement;
 	labelElement: HTMLElement;
 	descriptionElement: HTMLElement;
+	showMoreElement: HTMLElement;
 	valueElement: HTMLElement;
 	overridesElement: HTMLElement;
 }
@@ -811,6 +812,7 @@ class SettingItemRenderer implements IRenderer<ISettingItemEntry, ISettingItemTe
 		const labelElement = DOM.append(titleElement, $('span.setting-item-label'));
 		const overridesElement = DOM.append(titleElement, $('span.setting-item-overrides'));
 		const descriptionElement = DOM.append(leftElement, $('.setting-item-description'));
+		const showMoreElement = DOM.append(leftElement, $('.setting-show-more'));
 
 		const valueElement = DOM.append(rightElement, $('.setting-item-value'));
 
@@ -823,6 +825,7 @@ class SettingItemRenderer implements IRenderer<ISettingItemEntry, ISettingItemTe
 			categoryElement,
 			labelElement,
 			descriptionElement,
+			showMoreElement,
 			valueElement,
 			overridesElement
 		};