Files.app: Added a header to the middle bar and polish the design.

chrome/browser/resources/file_manager/css/file_manager.css

 /* Copyright (c) 2012 The Chromium Authors. All rights reserved.
  * Use of this source code is governed by a BSD-style license that can be
  * found in the LICENSE file. */
 
 html {
   height: 100%;
 }
 
 html.col-resize * {
   cursor: col-resize !important;
@@ skipping 333 matching lines @@
   white-space: nowrap;
 }
 
 body[new-ui] #volume-list .volume-icon {
   background-position: center 2px;
   background-repeat: no-repeat;
   height: 24px;
   width: 24px;
 }
 
+#middlebar-header {
+  -webkit-box-sizing: border-box;
+  -webkit-padding-start: 20px;
+  border-right: 1px solid rgb(212, 212, 212);
+  color: rgb(100, 100, 100);
+  height: 47px;
+  line-height: 40px;
+  position: absolute;
+  width: 100%;
+}
 
 #directory-tree {
   bottom: 0;
   left: 0;
   overflow-x: hidden;
   overflow-y: auto;
   position: absolute;
   right: 0;
-  top: 0;
+  top: 47px;
 }
 
 body[new-ui] #directory-tree {
   border-right: 1px solid rgb(212, 212, 212);
   padding-bottom: 52px;  /* height of the preview panel */
 }
 
 #directory-tree .tree-row {
   background-image: none;
   border: none;
@@ skipping 1214 matching lines @@
 .table-header {
   background-color: #f5f5f5;
   border-bottom: 1px #d2d2d2 solid;
   box-sizing: border-box;
   height: 27px;
 }
 
 body[new-ui] .table-header {
   background-color: transparent;
   border-bottom: none;
-  height: 40px;
+  height: 47px;
 }
 
 .table-header-sort-image-desc::after {
   -webkit-padding-start: 13px;
   background-image: -webkit-image-set(
     url('../images/files/ui/sort_desc.png') 1x,
     url('../images/files/ui/2x/sort_desc.png') 2x);
   background-position: center center;
   background-repeat: no-repeat;
   color: #888;
@@ skipping 107 matching lines @@
 #default-actions-list li {
   border: 1px solid white;
   border-left-width: 0;
   border-right-width: 0;
   height: 39px;
   padding-bottom: 1px;
   padding-top: 1px;
 }
 
 body[new-ui] #list-container li.table-row {
-  height: 30px;
+  border-style: none;
+  height: 29px;
+  margin: 0;
+  padding-bottom: 0;
+  padding-top: 0;
 }
 
 body[new-ui] #default-actions-list li {
   border-style: none;
 }
 
 /* The icon in the name column. See file_types.css for specific icons. */
 .detail-icon {
   height: 24px;
   width: 24px;
@@ skipping 651 matching lines @@
 body[new-ui] #iframe-drag-area {
   -webkit-app-region: drag;
   height: 45px;
   left: 64px;
   position: absolute;
   right: 70px;
   top: 0;
   width: auto;
   z-index: 101;
 }