Couple of styling updates to quick pick (microsoft#208242)

1. Separator descriptions no longer include opacity so that contrast ratio is satisfied
2. The separators are now a little taller so that they stand out compared to regular items

Author: TylerLeonhardt

src/vs/platform/quickinput/browser/media/quickInput.css

@@ -59,7 +59,7 @@
 
 .quick-input-header {
 	display: flex;
-	padding: 8px 6px 6px 6px;
+	padding: 8px 6px 2px 6px;
 }
 
 .quick-input-widget.hidden-input .quick-input-header {
@@ -323,12 +323,21 @@
 	background: none;
 }
 
-/* Quick input separators as full-row item */
 .quick-input-list .quick-input-list-separator-as-item {
-	font-weight: 600;
+	padding: 4px 6px;
 	font-size: 12px;
 }
 
+/* Quick input separators as full-row item */
+.quick-input-list .quick-input-list-separator-as-item .label-name {
+	font-weight: 600;
+}
+
+.quick-input-list .quick-input-list-separator-as-item .label-description {
+	/* Override default description opacity so we don't have a contrast ratio issue. */
+	opacity: 1 !important;
+}
+
 /* Hide border when the item becomes the sticky one */
 .quick-input-list .monaco-tree-sticky-row .quick-input-list-entry.quick-input-list-separator-as-item.quick-input-list-separator-border {
 	border-top-style: none;

src/vs/platform/quickinput/browser/quickInputTree.ts

@@ -277,9 +277,8 @@ class QuickPickSeparatorElement extends BaseQuickPickItemElement {
 class QuickInputItemDelegate implements IListVirtualDelegate<IQuickPickElement> {
 	getHeight(element: IQuickPickElement): number {
 
-		if (!element.item) {
-			// must be a separator
-			return 24;
+		if (element instanceof QuickPickSeparatorElement) {
+			return 30;
 		}
 		return element.saneDetail ? 44 : 22;
 	}