shell/workbench css cleanup

src/vs/base/browser/ui/contextview/contextview.css

@@ -6,37 +6,4 @@
 .context-view {
 	position: absolute;
 	z-index: 1000;
-}
-
-/* Tooltips */
-.context-view .tooltip {
-	padding: 5px;
-	position: relative;
-	margin-top: 4px;
-	margin-right: 4px;
-	max-width: 350px;
-
-	-webkit-animation: fadeIn 0.15s linear;
-	-o-animation: fadeIn 0.15s linear;
-	-moz-animation: fadeIn 0.15s linear;
-	-ms-animation: fadeIn 0.15s linear;
-	animation: fadeIn 0.15s linear;
-}
-
-.context-view .tooltip:before,
-.context-view .tooltip:after {
-	content: '';
-	position: absolute;
-	border-color: transparent;
-	border-style: solid;
-}
-
-.context-view.bottom.right .tooltip:before {
-	top: -12px;
-	right: 12px;
-}
-
-.context-view.bottom.right .tooltip:after {
-	top: -9px;
-	right: 13px;
 }
\ No newline at end of file

src/vs/workbench/electron-browser/media/shell.css

@@ -6,7 +6,6 @@
 .monaco-shell {
 	height: 100%;
 	width: 100%;
-	color: #6C6C6C;
 	margin: 0;
 	padding: 0;
 	overflow: hidden;
@@ -37,16 +36,36 @@
 	text-decoration: none;
 }
 
+.monaco-shell a:active {
+	color: inherit;
+	background-color: inherit;
+}
+
 .monaco-shell a.plain {
 	color: inherit;
 	text-decoration: none;
 }
 
-.monaco-shell a.plain:hover, .monaco-shell a.plain.hover {
+.monaco-shell a.plain:hover,
+.monaco-shell a.plain.hover {
 	color: inherit;
 	text-decoration: none;
 }
 
+.monaco-shell input {
+	color: inherit;
+	font-family: inherit;
+	font-size: 100%;
+}
+
+.monaco-shell select {
+	font-family: inherit;
+}
+
+.monaco-shell .pointer {
+	cursor: pointer;
+}
+
 /* START Keyboard Focus Indication Styles */
 
 .monaco-shell.vs [tabindex="0"]:focus,
@@ -57,7 +76,7 @@
 .monaco-shell.vs input[type="search"]:focus,
 .monaco-shell.vs input[type="text"]:focus, .monaco-shell.vs textarea:focus,
 .monaco-shell.vs input[type="checkbox"]:focus {
-	outline: 1px solid rgba(0, 122, 204, 0.4);
+	outline: 1px solid;
 	outline-offset: -1px;
 	opacity: 1 !important;
 }
@@ -85,7 +104,7 @@
 .monaco-shell.vs-dark input[type="search"]:focus,
 .monaco-shell.vs-dark input[type="text"]:focus, .monaco-shell.vs-dark textarea:focus,
 .monaco-shell.vs-dark input[type="checkbox"]:focus {
-	outline: 1px solid rgba(14, 99, 156, 0.6);
+	outline: 1px solid;
 	outline-offset: -1px;
 	opacity: 1 !important;
 }
@@ -97,17 +116,10 @@
 .monaco-shell.hc-black input[type="text"]:focus, .monaco-shell.hc-black textarea:focus,
 .monaco-shell.hc-black input[type="search"]:focus,
 .monaco-shell.hc-black input[type="checkbox"]:focus {
-	outline: 2px solid #f38518;
+	outline: 2px solid;
 	outline-offset: -1px;
 }
 
-.monaco-shell.vs .monaco-text-button:focus,
-.monaco-shell.vs-dark .monaco-text-button:focus,
-.monaco-shell.vs .action-button:focus,
-.monaco-shell.vs-dark .action-button:focus {
-	outline-color: rgba(255, 255, 255, .5); /* buttons have a blue color, so focus indication needs to be different */
-}
-
 .monaco-shell.vs .monaco-text-button:focus,
 .monaco-shell.vs .action-button:focus {
 	outline-offset: -2px; /* Inset outline so it stands out on light background. */
@@ -118,15 +130,15 @@
 }
 
 .monaco-shell.hc-black .synthetic-focus input {
-	background:transparent; /* Search input focus fix when in high contrast */
+	background: transparent; /* Search input focus fix when in high contrast */
 }
 
 .monaco-shell.vs .monaco-tree.focused .monaco-tree-row.focused [tabindex="0"]:focus {
-	outline: 1px solid #007ACC; /* higher contrast color for focusable elements in a row that shows focus feedback */
+	outline: 1px solid; /* higher contrast color for focusable elements in a row that shows focus feedback */
 }
 
 .monaco-shell.vs-dark .monaco-tree.focused .monaco-tree-row.focused [tabindex="0"]:focus {
-	outline: 1px solid #007ACC; /* higher contrast color for focusable elements in a row that shows focus feedback */
+	outline: 1px solid; /* higher contrast color for focusable elements in a row that shows focus feedback */
 }
 
 .monaco-shell .monaco-tree.focused.no-focused-item:focus:before {
@@ -141,17 +153,17 @@
 }
 
 .monaco-shell.vs .monaco-tree.focused.no-focused-item:focus:before {
-	outline: 1px solid rgba(0, 122, 204, 0.4); /* we still need to handle the empty tree or no focus item case */
+	outline: 1px solid; /* we still need to handle the empty tree or no focus item case */
 	outline-offset: -1px;
 }
 
 .monaco-shell.vs-dark .monaco-tree.focused.no-focused-item:focus:before {
-	outline: 1px solid rgba(14, 99, 156, 0.6); /* we still need to handle the empty tree or no focus item case */
+	outline: 1px solid; /* we still need to handle the empty tree or no focus item case */
 	outline-offset: -1px;
 }
 
 .monaco-shell.hc-black .monaco-tree.focused.no-focused-item:focus:before {
-	outline: 2px solid #f38518; /* we still need to handle the empty tree or no focus item case */
+	outline: 2px solid; /* we still need to handle the empty tree or no focus item case */
 	outline-offset: -2px;
 }
 
@@ -192,87 +204,103 @@
 
 /* END Keyboard Focus Indication Styles */
 
-.monaco-shell a.prominent {
-	text-decoration: underline;
-}
+/* TODO@theme */
 
-a:active {
-	color: inherit;
-	background-color: inherit;
+.monaco-shell.vs {
+	color: #6C6C6C;
 }
 
-.monaco-shell input {
-	color: inherit;
-	font-family: inherit;
+.monaco-shell.vs-dark {
+	color: #BBB;
+	background-color: #1E1E1E;
 }
 
-.monaco-shell select {
-	font-family: inherit;
+.monaco-shell.hc-black {
+	color: #fff;
+	background-color: #000;
 }
 
-.monaco-shell .pointer {
-	cursor: pointer;
+.monaco-shell.vs input {
+	background-color: white;
 }
 
-.monaco-shell .context-view .tooltip {
-	background-color: white;
-	border: 1px solid #ccc;
+.monaco-shell.vs-dark input,
+.monaco-shell.vs-dark textarea {
+	background-color: #3C3C3C;
 }
 
-.monaco-shell .context-view.bottom.right .tooltip:before {
-	border-width: 6px;
-	border-bottom: 6px solid #ccc;
+.monaco-shell.vs input:disabled {
+	background-color: #E1E1E1;
 }
 
-.monaco-shell .context-view.bottom.right .tooltip:after {
-	border-width: 5px;
-	border-bottom: 5px solid white;
+.monaco-shell.vs-dark input:disabled {
+	background-color: #333;
 }
 
-.monaco-shell input:disabled {
-	background-color: #E1E1E1;
+.monaco-shell.hc-black input,
+.monaco-shell.hc-black textarea {
+	background-color: #000;
 }
 
-/* ---------- Dark Theme ---------- */
+/* START Keyboard Focus Indication Styles */
 
-.monaco-shell.vs-dark {
-	color: #BBB;
-	background-color: #1E1E1E;
+.monaco-shell.vs [tabindex="0"]:focus,
+.monaco-shell.vs .synthetic-focus,
+.monaco-shell.vs select:focus,
+.monaco-shell.vs input[type="button"]:focus,
+.monaco-shell.vs input[type="submit"]:focus,
+.monaco-shell.vs input[type="search"]:focus,
+.monaco-shell.vs input[type="text"]:focus, .monaco-shell.vs textarea:focus,
+.monaco-shell.vs input[type="checkbox"]:focus {
+	outline-color: rgba(0, 122, 204, 0.4);
 }
 
-.monaco-shell.vs-dark .monaco-action-bar.vertical .action-label.separator {
-	border-bottom-color: #666;
+.monaco-shell.vs-dark [tabindex="0"]:focus,
+.monaco-shell.vs-dark .synthetic-focus,
+.monaco-shell.vs-dark select:focus,
+.monaco-shell.vs-dark input[type="button"]:focus,
+.monaco-shell.vs-dark input[type="submit"]:focus,
+.monaco-shell.vs-dark input[type="search"]:focus,
+.monaco-shell.vs-dark input[type="text"]:focus, .monaco-shell.vs-dark textarea:focus,
+.monaco-shell.vs-dark input[type="checkbox"]:focus {
+	outline-color: rgba(14, 99, 156, 0.6);
 }
 
-.monaco-shell.vs-dark .context-view .tooltip {
-	background-color: #1E1E1E;
-	border-color: #707070;
+.monaco-shell.hc-black [tabindex="0"]:focus,
+.monaco-shell.hc-black .synthetic-focus,
+.monaco-shell.hc-black select:focus,
+.monaco-shell.hc-black input[type="button"]:focus,
+.monaco-shell.hc-black input[type="text"]:focus, .monaco-shell.hc-black textarea:focus,
+.monaco-shell.hc-black input[type="search"]:focus,
+.monaco-shell.hc-black input[type="checkbox"]:focus {
+	outline-color: #f38518;
 }
 
-.monaco-shell.vs-dark .context-view.bottom.right .tooltip:before {
-	border-bottom: 6px solid #707070;
+.monaco-shell.vs .monaco-text-button:focus,
+.monaco-shell.vs-dark .monaco-text-button:focus,
+.monaco-shell.vs .action-button:focus,
+.monaco-shell.vs-dark .action-button:focus {
+	outline-color: rgba(255, 255, 255, .5); /* buttons have a blue color, so focus indication needs to be different */
 }
 
-.monaco-shell.vs-dark .context-view.bottom.right .tooltip:after {
-	border-bottom: 5px solid #1E1E1E;
+.monaco-shell.vs .monaco-tree.focused .monaco-tree-row.focused [tabindex="0"]:focus {
+	outline-color: #007ACC; /* higher contrast color for focusable elements in a row that shows focus feedback */
 }
 
-.monaco-shell.vs-dark input:disabled {
-	background-color: #333;
+.monaco-shell.vs-dark .monaco-tree.focused .monaco-tree-row.focused [tabindex="0"]:focus {
+	outline-color: #007ACC; /* higher contrast color for focusable elements in a row that shows focus feedback */
 }
 
-/* ---------- High Contrast Theme ---------- */
-
-.monaco-shell.hc-black { color: #fff; background-color: #000; }
+.monaco-shell.vs .monaco-tree.focused.no-focused-item:focus:before {
+	outline-color: rgba(0, 122, 204, 0.4); /* we still need to handle the empty tree or no focus item case */
+}
 
-.monaco-shell.hc-black .context-view .tooltip {
-	background-color: black;
+.monaco-shell.vs-dark .monaco-tree.focused.no-focused-item:focus:before {
+	outline-color: rgba(14, 99, 156, 0.6); /* we still need to handle the empty tree or no focus item case */
 }
 
-.monaco-shell.hc-black .context-view .tooltip:before {
-	border-width: 0 !important;
+.monaco-shell.hc-black .monaco-tree.focused.no-focused-item:focus:before {
+	outline-color: #f38518; /* we still need to handle the empty tree or no focus item case */
 }
 
-.monaco-shell.hc-black .context-view .tooltip:after {
-	border-width: 0 !important;
-}
\ No newline at end of file
+/* END Keyboard Focus Indication Styles */
\ No newline at end of file

src/vs/workbench/electron-browser/media/workbench.css

@@ -3,11 +3,6 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-.context-view .tooltip.customhover {
-	text-overflow: ellipsis;
-	overflow: hidden;
-}
-
 .monaco-workbench-container {
 	position: absolute;
 }
@@ -20,10 +15,6 @@
 	overflow: hidden;
 }
 
-.monaco-workbench input {
-	font-size: 100%;
-}
-
 .monaco-workbench > .part {
 	position: absolute;
 	box-sizing:	border-box;
@@ -46,75 +37,56 @@
 	z-index: 10000;
 }
 
-/* ---------- Light Theme ---------- */
-
-.vs .monaco-workbench	{ background-color: #F3F3F3; }
-
-.vs .monaco-workbench .sidebar .separator	{ background-color: #EFEFF2; }
-
-.vs .monaco-workbench input {
-	background-color: white;
+.hc-black #monaco-workbench-drop-overlay {
+	background: none !important;
+	outline: 2px dashed;
+	outline-offset: -2px;
 }
 
-.vs .monaco-workbench input:disabled {
-	background-color: #E1E1E1;
+.hc-black .monaco-workbench .monaco-action-bar .action-item.disabled .action-label.disabled {
+	opacity: 0.4;
 }
 
-.vs #monaco-workbench-drop-overlay {
-	background-color: rgba(51,153,255, 0.18);
-}
+/* TODO@theme */
 
-/* ---------- Dark Theme ---------- */
+.vs .monaco-workbench	{
+	background-color: #F3F3F3;
+}
 
 .vs-dark .monaco-workbench {
-	--input-bgcolor: #3C3C3C;
 	background-color: #252526;
 	color: #CCC;
 }
 
-.vs-dark .monaco-workbench .monaco-scrollable-element .shadow.top {	box-shadow: #000 0 6px 6px -6px inset; }
-.vs-dark .monaco-workbench .monaco-scrollable-element .shadow.left { box-shadow: #000 6px 0 6px -6px inset; }
-.vs-dark .monaco-workbench .monaco-scrollable-element .shadow.top.left { box-shadow: #000 6px 6px 6px -6px inset; }
-.vs-dark .monaco-workbench .monaco-scrollable-element .slider.active { background-color: rgba(85, 85, 85, .8); }
-
-.vs-dark .monaco-workbench .sidebar	{ border: none; }
-.vs-dark .monaco-workbench .sidebar .separator	{ background-color: #2D2D30; }
-
-.vs-dark .monaco-workbench input,
-.vs-dark .monaco-workbench textarea {
-	background-color: var(--input-bgcolor);
+.hc-black .monaco-workbench {
+	color: #FFF;
+	background-color: #000;
 }
 
-.vs-dark .monaco-workbench input:disabled {
-	background-color: #333;
+.vs #monaco-workbench-drop-overlay {
+	background-color: rgba(51,153,255, 0.18);
 }
 
-.vs-dark .monaco-workbench .viewlet .message { opacity: 0.5; }
-
-.vs-dark .monaco-workbench .stacked-view .action-label		{ color: inherit; }
-.vs-dark .monaco-workbench .stacked-view .action-label:hover { color: #3399FF; }
-
 .vs-dark #monaco-workbench-drop-overlay {
 	background-color: rgba(83, 89, 93, 0.5);
 }
 
-/* ---------- HC Theme ---------- */
-
-.hc-black .monaco-workbench { color: #FFF; background-color: #000; }
+.hc-black #monaco-workbench-drop-overlay {
+	outline-color: #f38518;
+}
 
-.hc-black .monaco-workbench .sidebar .separator { background-color: #000; border: 1px solid #6FC3DF; }
+.vs-dark .monaco-workbench .monaco-scrollable-element .shadow.top {
+	box-shadow: #000 0 6px 6px -6px inset;
+}
 
-.hc-black .monaco-workbench input,
-.hc-black .monaco-workbench textarea {
-	background-color: #000;
+.vs-dark .monaco-workbench .monaco-scrollable-element .shadow.left {
+	box-shadow: #000 6px 0 6px -6px inset;
 }
 
-.hc-black .monaco-workbench .monaco-action-bar .action-item.disabled .action-label.disabled {
-	opacity: .4;
+.vs-dark .monaco-workbench .monaco-scrollable-element .shadow.top.left {
+	box-shadow: #000 6px 6px 6px -6px inset;
 }
 
-.hc-black #monaco-workbench-drop-overlay {
-	background: none !important;
-	outline: 2px dashed #f38518;
-	outline-offset: -2px;
+.vs-dark .monaco-workbench .monaco-scrollable-element .slider.active {
+	background-color: rgba(85, 85, 85, .8);
 }
\ No newline at end of file

src/vs/workbench/parts/search/browser/media/searchviewlet.css

@@ -336,6 +336,10 @@
 	border: 1px dashed rgb(51, 255, 46);
 }
 
+.monaco-workbench .search-viewlet a.prominent {
+	text-decoration: underline;
+}
+
 /* Theming */
 
 .search-viewlet .highlight {