[filemanager] Importing progress implemented.

chrome/browser/resources/file_manager/css/photo_import.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. */
 
 .photo-import {
   -webkit-user-select: none;
   bottom: 0;
   font-family: Open Sans, Droid Sans Fallback, sans-serif;
   font-size: 84%;
   left: 0;
   margin: 0;
   overflow: hidden;
   position: absolute;
   right: 0;
   top: 0;
 }
 
 .photo-import[loading] grid,
 .photo-import:not([loading]) .spinner {
   display: none;
 }
 
 .grid-container {
   -webkit-box-orient: vertical;
   bottom: 0;
   display: -webkit-box;
   left: 0;
-  padding: 20px;
+  padding: 0 20px;
   position: absolute;
   right: 0;
   top: 0;
 }
 
 .spinner {
   background-image: url('../images/common/spinner_white.svg');
   background-size: 100%;
   height: 22px;
   left: 50%;
   margin-left: -11px;
   margin-top: -11px;
   position: absolute;
   top: 50%;
   width: 22px;
 }
 
 /* The top and bottom bars with buttons */
 
 .topbar,
 .bottombar {
   -webkit-box-align: center;
   -webkit-box-orient: horizontal;
   display: -webkit-box;
-  height: 80px;
+  height: 60px;
   width: 100%;
 }
 
 .caption {
   -webkit-box-flex: 1;
   font-size: 150%;
   margin-left: 8px;
 }
 
 .bottombar label {
   -webkit-box-flex: 1;
   display: block;
 }
 
+.bottombar input {
+  margin-top: 10px;
+}
+
 button.import {
   -webkit-margin-end: 20px;
   min-width: 100px;
 }
 
 /* The cr.ui.Grid representing the files. */
 .photo-import grid {
   -webkit-box-flex: 1;
   overflow-y: auto;
   width: 100%;
@@ skipping 68 matching lines @@
 }
 
 .grid-item[lead] img,
 .grid-item[selected] img,
 .grid-item:hover img,
 .grid-item[lead] .img-container[generic-thumbnail],
 .grid-item[selected] .img-container[generic-thumbnail],
 .grid-item:hover .img-container[generic-thumbnail] {
   outline: 2px solid rgb(51, 153, 255);
 }
+
+/* Importing dialog styles */
+.importing-dialog .cr-dialog-frame {
+  -webkit-box-align: center;
+  -webkit-box-orient: horizontal;
+  display: -webkit-box;
+}
+
+.importing-dialog .cr-dialog-frame .progress-container {
+  -webkit-box-flex: 1;
+  -webkit-box-orient: vertical;
+  display: -webkit-box;
+  padding: 0 0 40px 10px;
+}
+
+.importing-dialog .img-container {
+  height: 120px;
+  overflow: hidden;
+  width: 120px;
+}
+
+.importing-dialog button {
+  bottom: 14px;
+  min-width: 80px;
+  position: absolute;
+  right: 14px;
+}
+
+.progress-bar {
+  -webkit-box-flex: 1;
+  border: 1px solid #999;
+  height: 8px;
+  padding: 1px;
+}
+
+.progress-track {
+  -webkit-animation-duration: 800ms;
+  -webkit-animation-iteration-count: infinite;
+  -webkit-animation-name: bg;
+  -webkit-animation-timing-function: linear;
+  background-color: #ccc;
+  background-image: -webkit-linear-gradient(315deg, transparent,
+      transparent 33%, rgba(0, 0, 0, 0.12) 33%, rgba(0, 0, 0, 0.12) 66%,
+      transparent 66%, transparent);
+  background-position: 0 0;
+  background-repeat: repeat-x;
+  background-size: 16px 8px;
+  height: 8px;
+}
+
+@-webkit-keyframes bg {
+  0% { background-position: 0 0; }
+  100% { background-position: -16px 0; }
+}