parameter hints: first steps

related to #2330
microsoft · Sep 12, 2016 · 4db0dac · 4db0dac
1 parent 922dd9a
commit 4db0dac
Show file tree

Hide file tree

Showing 2 changed files with 158 additions and 162 deletions.
diff --git a/src/vs/editor/contrib/parameterHints/browser/parameterHints.css b/src/vs/editor/contrib/parameterHints/browser/parameterHints.css
@@ -4,13 +4,19 @@
  *--------------------------------------------------------------------------------------------*/
 
 .monaco-editor .parameter-hints-widget {
-	font-size: 12px;
-	width: 440px;
 	z-index: 10;
+	background-color: #F3F3F3;
+	border: 1px solid rgb(200, 200, 200);
+	/*padding: 0 0.5em 0 0.5em;*/
 }
 
-.monaco-editor.mac .parameter-hints-widget {
-	font-size: 11px;
+.monaco-editor .parameter-hints-widget > .wrapper {
+	max-width: 440px;
+}
+
+.monaco-editor .parameter-hints-widget.multiple {
+	min-height: 3.3em;
+	padding: 0 0 0 1.9em;
 }
 
 .monaco-editor .parameter-hints-widget.visible {
@@ -20,17 +26,27 @@
 	transition: left .05s ease-in-out;
 }
 
-.monaco-editor .parameter-hints-widget .wrapper {
-	position: relative;
-	bottom: 0;
-	border: 1px solid #ccc;
-	max-width: 440px;
-	padding: 0 0.5em 0 0.5em;
+.monaco-editor .parameter-hints-widget p,
+.monaco-editor .parameter-hints-widget ul {
+	margin: 8px 0;
 }
 
-.monaco-editor .parameter-hints-widget.multiple .wrapper {
-	min-height: 3.3em;
-	padding: 0 0.5em 0 1.9em;
+.monaco-editor .parameter-hints-widget.multiple .body {
+	height: 100%;
+	border-left: 1px solid rgba(204, 204, 204, 0.5);
+}
+
+.monaco-editor .parameter-hints-widget .signature {
+	padding: 4px 5px;
+}
+
+.monaco-editor .parameter-hints-widget .signature.has-docs {
+	border-bottom: 1px solid rgba(204, 204, 204, 0.5);
+}
+
+.monaco-editor .parameter-hints-widget .docs {
+	padding: 0 5px;
+	font-size: 95%;
 }
 
 .monaco-editor .parameter-hints-widget .buttons {
@@ -66,7 +82,6 @@
 .monaco-editor .parameter-hints-widget .overloads {
 	position: absolute;
 	display: none;
-	font-size: 10px;
 	text-align: center;
 	bottom: 14px;
 	left: 0;
@@ -80,10 +95,6 @@
 	display: block;
 }
 
-.monaco-editor .parameter-hints-widget .signatures {
-	overflow: hidden;
-}
-
 .monaco-editor .parameter-hints-widget .signature .parameter {
 	display: inline-block;
 }
@@ -93,25 +104,23 @@
 	text-decoration: underline;
 }
 
-.monaco-editor .parameter-hints-widget .documentation {
-	max-height: 3.2em;
-	overflow: hidden;
-	color: #A21B1B;
-}
-
 .monaco-editor .parameter-hints-widget .documentation-parameter > .parameter {
 	font-weight: bold;
 	margin-right: 0.5em;
 }
 
 /*** VS Dark */
 
-.monaco-editor.vs-dark .parameter-hints-widget .wrapper {
-	border-color: #707070;
+.monaco-editor.vs-dark .parameter-hints-widget {
+	background-color: #2D2D30;
+	border-color: rgba(85,85,85,0.5);
 }
 
-.monaco-editor.vs-dark .parameter-hints-widget .documentation {
-	color: #C07A7A;
+.monaco-editor.hc-black .parameter-hints-widget .body,
+.monaco-editor.vs-dark .parameter-hints-widget .body,
+.monaco-editor.hc-black .parameter-hints-widget .signature,
+.monaco-editor.vs-dark .parameter-hints-widget .signature {
+	border-color: rgba(85,85,85,0.5);
 }
 
 .monaco-editor.hc-black .parameter-hints-widget .button.previous,
@@ -126,10 +135,7 @@
 
 /*** High Contrast */
 
-.monaco-editor.hc-black .parameter-hints-widget .wrapper {
-	border-color: #707070;
-}
-
-.monaco-editor.hc-black .parameter-hints-widget .documentation {
-	color: #C07A7A;
-}
+.monaco-editor.hc-black .parameter-hints-widget {
+	background-color: #0C141F;
+	border: 2px solid #6FC3DF;
+}