[DevTools] Merge filter bar with the main toolbar

third_party/WebKit/Source/devtools/front_end/ui/toolbar.css

Index: third_party/WebKit/Source/devtools/front_end/ui/toolbar.css
diff --git a/third_party/WebKit/Source/devtools/front_end/ui/toolbar.css b/third_party/WebKit/Source/devtools/front_end/ui/toolbar.css
index 6223cbfd37c82045fab64471c63e1331917b8404..67545ff8e6400da9b434a978c9eaec4dbd57d183 100644
--- a/third_party/WebKit/Source/devtools/front_end/ui/toolbar.css
+++ b/third_party/WebKit/Source/devtools/front_end/ui/toolbar.css
@@ -200,7 +200,7 @@ select.toolbar-item {
 
 /* Input */
 
-input.toolbar-item {
+.toolbar-input {
     width: 120px;
     height: 20px;
     padding: 3px;
@@ -209,11 +209,28 @@ input.toolbar-item {
     border: solid 1px #d8d8d8;
 }
 
-input.toolbar-item:focus,
-input.toolbar-item.hover {
+.toolbar-input:focus,
+.toolbar-input.focused,
+.toolbar-input.hover {
     border: solid 1px rgb(202, 202, 202);
 }
 
+.toolbar-input > input {
+    border: none;
+    flex-grow: 1;
+}
+
+.toolbar-input-clear-button {
+    opacity: 0.7;
+    flex-basis: 13px;
+    flex-shrink: 0;
+    height: 13px;
+}
+
+.toolbar-input-clear-button:hover {
+    opacity: 1;
+}
+
 /* Separator */
 
 .toolbar-divider {