Update import details panel to comply (mostly) with UX direction.

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

 /* Copyright (c) 2014 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. */
 
 /* The order of z-index:
  * - -1: text-measure
  * - 2: drag-selection-border
  * - 3: preview-panel
  * - 500: scrollbar
  * - 500: splitter
@@ skipping 331 matching lines @@
 .dialog-header button.icon-button > core-icon {
   margin: 8px;
 }
 
 #cloud-import-details-button {
   margin-left: -15px;
 }
 
 #cloud-import-details {
   background-color: white;
-  height: 300px;
-  opacity: .85;
-  padding: 10px;
+  border-radius: 4px;
+  box-shadow: 2px 2px 6px #555555;
+  font-family: 'Roboto';

[mtomasz, 2015/02/12 03:22:01]

nit: Roboto should be default in the entire Files app already, could you
confirm?

[Steve McKay, 2015/02/12 23:15:53]

Done.

   position: absolute;
-  right: 0px;
-  top: 49px;
+  right: 75px;
+  top: 38px;

[mtomasz, 2015/02/12 03:22:01]

Please comment all magical numbers. Does it have to be in sync with eg. the
header height or the button position, etc?

[Steve McKay, 2015/02/12 23:15:53]

Done.

   transition: all 0.2s ease;

[mtomasz, 2015/02/12 03:22:01]

Position transition with top/left/right/bottom are janky. Please use transform:
translateX(...) instead.

[Steve McKay, 2015/02/12 23:15:53]

Done.

   width: 250px;
   z-index: 5;
 }
 
-#cloud-import-details.offscreen {
+#cloud-import-details.hidden {
+  right: 50px;
   opacity: 0;
-  right: -202px;
 }
 
-#cloud-import-details div {
-  border: 0px 0px 1px 0px solid gray;
-  padding: 10px;
+#cloud-import-details .banner {
+  background-color: #37474F;
+  border-radius: 4px 4px 0px 0px ;

[mtomasz, 2015/02/12 03:22:01]

nit: \s; -> ;

[Steve McKay, 2015/02/12 23:15:53]

Done.

+  color: white;
+  padding: 20px;
+  font-size: 12pt;

[mtomasz, 2015/02/12 03:22:01]

nit: Please use percents for font sizes, so the UI scales correctly when
different default font size is chosen.

[Steve McKay, 2015/02/12 23:15:53]

K. Done.

+  line-height: 1.2em;
+}
+
+#cloud-import-details .banner .title {
+  font-size: 14pt;
+  margin-bottom: 5px;
+}
+
+#cloud-import-details .main {
+  display: flex;
+  flex-direction: column;
+  padding: 20px;
+}
+
+#cloud-import-details .status {
+  display: flex;
+  flex-direction: row;
+  font-color: #646464;
+  font-size: 12pt;
+}
+
+#cloud-import-details .status .leader {
+  font-color: #333333;
+  font-size: 13pt;
+}
+
+#cloud-import-details .status core-icon {
+  display: block;
+  height: 16px;
+  margin-right: 10px;
+  opacity: .6;
+  width: 16px;
+}
+
+#cloud-import-details .status .destination-link {
+  color: #1BA8F3;
+  cursor: pointer;
+}
+
+#cloud-import-details paper-button.import {
+  align-self: flex-end;
+  background-color: #1BA8F3;
+  color: white;
+  margin-top: 20px;
 }
 
 #files-selected-label {
   display: none;
   margin: 0 10px;
 }
 
 body.selecting #files-selected-label {
   display: block;
 }
@@ skipping 1514 matching lines @@
   padding: 20px 15px;
 }
 
 .text-measure {
   pointer-events: none;
   position: absolute;
   top: 0;
   visibility: hidden;
   z-index: -1;
 }