Show location, search button, and change-view button on the toolbar.

ui/file_manager/file_manager/foreground/css/file_manager.css

Index: ui/file_manager/file_manager/foreground/css/file_manager.css
diff --git a/ui/file_manager/file_manager/foreground/css/file_manager.css b/ui/file_manager/file_manager/foreground/css/file_manager.css
index 1275c1212330449e28cd0bb62441e6e83e1baffa..3403756e6df6e50305c49ea30a43601f52795884 100644
--- a/ui/file_manager/file_manager/foreground/css/file_manager.css
+++ b/ui/file_manager/file_manager/foreground/css/file_manager.css
@@ -402,38 +402,24 @@ div.splitter {
   transition: all 180ms ease;
 }
 
-/* Search box */
-
-#search-box {
-  display: flex;
-  flex: auto;
-}
-
-#search-box .icon {
-  -webkit-app-region: no-drag;
-  -webkit-padding-end: 0;
-  -webkit-padding-start: 10px;
-  background: transparent -webkit-image-set(
-      url(../images/files/ui/search_icon_inactive.png) 1x,
-      url(../images/files/ui/2x/search_icon_inactive.png) 2x)
-      no-repeat center;
+.dialog-header .volume-icon {
+  -webkit-margin-start: 10px;
+  background-position: center 3px;
+  background-repeat: no-repeat;
   flex: none;
-  height: 32px;
-  padding-bottom: 8px;
-  padding-top: 8px;
-  width: 32px;
+  height: 24px;
+  width: 24px;
 }
 
-#search-box .icon:hover,
-#search-box.has-cursor .icon,
-#search-box.has-text .icon {
-  background-image: -webkit-image-set(
-      url(../images/files/ui/search_icon_active.png) 1x,
-      url(../images/files/ui/2x/search_icon_active.png) 2x);
+.dialog-header > .spacer {
+  flex: auto;
 }
 
-#search-box .full-size {
-  flex: 1 0 0;
+/* Search box */
+
+#search-box {
+  display: flex;
+  flex: none;
 }
 
 #search-box input {
@@ -449,6 +435,8 @@ div.splitter {
   max-width: 100%;
   outline: none;
   padding: 0;
+  transition: width 0.2s ease;
+  width: 0;
 }
 
 #search-box input::-webkit-search-cancel-button {
@@ -457,7 +445,7 @@ div.splitter {
 
 #search-box.has-cursor input,
 #search-box.has-text input {
-  cursor: text;
+  width: 130px;
 }
 
 #search-box .clear {
@@ -476,13 +464,19 @@ div.splitter {
   min-width: 0;
   outline: none;
   padding: 0;
+  visibility: hidden;
   width: 12px;
 }
 
+#search-box.has-cursor .clear,
 #search-box.has-text .clear {
   display: block;
 }
 
+#search-box.has-text .clear {
+  visibility: visible;
+}
+
 #search-box .clear:hover {
   background-image: -webkit-image-set(
       url(../images/files/ui/search_clear_hover.png) 1x,
@@ -499,6 +493,24 @@ div.splitter {
   flex: none;
 }
 
+.topbutton-bar .search-button {
+  background-image: -webkit-image-set(
+      url(../images/files/ui/search_icon_active.png) 1x,
+      url(../images/files/ui/2x/search_icon_active.png) 2x);
+}
+
+.topbutton-bar .view-button.table {
+  background-image: -webkit-image-set(
+      url('../images/files/ui/button_list_view.png') 1x,
+      url('../images/files/ui/2x/button_list_view.png') 2x);
+}
+
+.topbutton-bar .view-button.grid {
+  background-image: -webkit-image-set(
+      url('../images/files/ui/button_mosaic_view.png') 1x,
+      url('../images/files/ui/2x/button_mosaic_view.png') 2x);
+}
+
 /* Container for the detail and thumbnail list views. */
 .dialog-body {
   -webkit-transition: all 180ms ease;
@@ -575,7 +587,7 @@ div.splitter {
 
 /* A single directory name in the list of path breadcrumbs. */
 .breadcrumb-path {
-  color: #969696;
+  color: #141414;
   cursor: pointer;
   flex: none;
   overflow: hidden;
@@ -986,6 +998,10 @@ li[renaming=''] .filename-label {
   flex: auto;
 }
 
+.preview-panel .preview-text {
+  color: #333;
+}
+
 .preview-thumbnails {
   display: flex;
   flex-direction: row;
@@ -1590,34 +1606,6 @@ list.autocomplete-suggestions > [lead] > div.detail-text em {
   -webkit-margin-end: 50px;
 }
 
-/* View buttons in the gear menu. */
-
-menuitem#detail-view {
-  background-image: -webkit-image-set(
-    url('../images/files/ui/button_list_view.png') 1x,
-    url('../images/files/ui/2x/button_list_view.png') 2x);
-}
-
-menuitem#detail-view[selected]:not([disabled]),
-menuitem#detail-view[lead]:not([disabled]) {
-  background-image: -webkit-image-set(
-    url('../images/files/ui/button_list_view_white.png') 1x,
-    url('../images/files/ui/2x/button_list_view_white.png') 2x);
-}
-
-menuitem#thumbnail-view {
-  background-image: -webkit-image-set(
-    url('../images/files/ui/button_mosaic_view.png') 1x,
-    url('../images/files/ui/2x/button_mosaic_view.png') 2x);
-}
-
-menuitem#thumbnail-view[selected]:not([disabled]),
-menuitem#thumbnail-view[lead]:not([disabled]) {
-  background-image: -webkit-image-set(
-    url('../images/files/ui/button_mosaic_view_white.png') 1x,
-    url('../images/files/ui/2x/button_mosaic_view_white.png') 2x);
-}
-
 #iframe-drag-area {
   -webkit-app-region: drag;
   height: 48px;