Initial restyle of the gallery.

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 1207 matching lines @@
 .preview-thumbnails {
   -webkit-box-orient: horizontal;
   display: -webkit-box;
   padding-left: 39px;
 }
 
 body[new-ui] .preview-thumbnails {
   padding-left: 25px;
 }
 
-
 .preview-thumbnails > .thumbnail {
   -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
   background-color: #f2f2f2;
   border: 1px solid #fff;
   height: 45px;
   margin: 0 0 0 -39px;  /* Show 7 pixels of the overlapped image */
   position: relative;
   width: 45px;
 }
 
@@ skipping 18 matching lines @@
 }
 
 body[new-ui] .preview-thumbnails > .thumbnail > .img-container {
   -webkit-box-sizing: border-box;
   background-size: 35px 35px;
   border: 1px solid white;
   height: 35px;
   width: 35px;
 }
 
+body[new-ui] .preview-thumbnails > .thumbnail > .img-container >
+    img.not(.cached) {
+  -webkit-animation: fadeIn ease-in 1;

[yoshiki, 2013/04/20 01:49:20]

nit: they should be separated to keep consistency with #1269-1270.

-webkit-animation-name: fadeIn
-webkit-animation-timing-function: ease-in
-webkit-animation-iteration-count: 1

[mtomasz, 2013/04/22 02:51:44]

I've moved it to a one line, since it is more frequent I think. Done.

+  -webkit-animation-duration: 500ms;
+  -webkit-animation-fill-mode: forwards;
+}
+
+@-webkit-keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
 .preview-thumbnails > .popup {
   -webkit-transform: translate(0, 3px) scale(0.95);
   background-color: #f2f2f2;
   border: 2px solid #fff;
   box-shadow: 0 0 0 1px #F0F0F0,
               0 0 0 2px #D0D0D0,
               2px 2px 6px rgba(0, 0, 0, 0.2);
   margin: 6px 0 0 -40px;
   opacity: 0;
   pointer-events: none;
@@ skipping 761 matching lines @@
   background-image: -webkit-image-set(
     url('../images/files/ui/new-ui/button_list_view.png') 1x,
     url('../images/files/ui/new-ui/2x/button_list_view.png') 2x);
 }
 
 body[new-ui] menuitem#thumbnail-view {
   background-image: -webkit-image-set(
     url('../images/files/ui/new-ui/button_mosaic_view.png') 1x,
     url('../images/files/ui/new-ui/2x/button_mosaic_view.png') 2x);
 }
+
+body[new-ui] #iframe-drag-area {
+  -webkit-app-region: drag;
+  height: 45px;
+  left: 64px;
+  position: absolute;
+  right: 0;
+  top: 0;
+  z-index: 101;
+}