Dragging files (not dropping yet).

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.
  */
 
 /* Outer frame of the dialog. */
 body {
    -webkit-box-flex: 1;
    -webkit-box-orient: vertical;
@@ skipping 565 matching lines @@
 div.img-container {
   position: relative;
   overflow: hidden;
   margin: 4px;
   width: 112px;
   height: 112px;
 }
 
 div.img-container > img {
   position: absolute;
+  -webkit-user-drag: none;
 }
 
 .list-container list > *,
 .list-container grid > * {
   background-image: none;
   border-radius: 0;
   line-height: 30px;
 }
 
 .list-container list > [selected],
@@ skipping 54 matching lines @@
 }
 
 /* Text box used for renaming in the thumbnail list. */
 .thumbnail-grid input.rename {
   -webkit-margin-start: -1px;
   width: 114px;
   height: 20px;
   -webkit-box-sizing: border-box;
 }
 
+.thumbnail-grid li,
+.detail-table list li {
+  -webkit-user-drag: element;
+}
+
 /* The cr.ui.Table representing the detailed file list. */
 .detail-table {
   width: 100%;
   border: 0;
 }
 
 /* Bottom pane describing current selection. */
 .preview-panel {
   -webkit-box-orient: horizontal;
   display: -webkit-box;
@@ skipping 363 matching lines @@
   color: #666666;
   overflow: hidden;
   padding: 5px;
   text-overflow: ellipsis;
   white-space: nowrap;
   vertical-align: middle;
 }
 
 .dialog-footer .filename-label {
   -webkit-box-orient: horizontal;
+  background-color: white;
   color: #666;
   display: -webkit-box;
   font-weight: bold;
   padding-top: 4px;
   padding-right: 4px;
 }
 
 .detail-name > * {
   display: -webkit-box;
   -webkit-box-align: center;
@@ skipping 30 matching lines @@
 .overlay-pane {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   border: none;
   z-index: 100;
 }
 
+/* Invisible container for elements representing files while dragging. */
+#drag-image-container {
+  position: fixed;
+  /* Only nodes in visiblt viewport will be rendered. */

[dgozman, 2012/03/26 13:10:23]

typo: visibilt

[SeRya, 2012/03/26 13:37:45]

Done.

+  top: 0;
+  left: 0;
+  display: -webkit-box;
+  -webkit-box-orient: horizontal;
+  padding-left: 100px;
+  z-index: -1;  /* below .dialog-container */
+}
+
+#drag-image-container > li {

[dgozman, 2012/03/26 13:10:23]

If you make this |list|. and not a |div|, this styles should be applied
automatically.

[SeRya, 2012/03/26 13:37:45]

Done.

+  display: inline-block;
+  background-color: #CBDBF1;
+  border-color: #E0E9F7;
+  border: 1px solid white; /* transparent white */
+  cursor: default;
+  line-height: 20px;
+  margin: 0 0 0 -100px;
+  overflow: hidden;
+  padding: 0 3px;
+  position: relative; /* to allow overlap */
+  text-overflow: ellipsis;
+  white-space: pre;
+}
+
+#drag-image-container > li input[type=checkbox] {
+  display: none;
+}
+
 menu.file-context-menu {
   z-index: 4;
 }
 
 input.common.pin[type="checkbox"]:checked::after {
   content: url('../images/pin.png');
   left: 3px;
   top: -4px;
 }
 
 div.offline {
   -webkit-box-pack: center;
   display: -webkit-box;
 }
 
 div.offline > * {
   -webkit-box-align: center;
   display: -webkit-box;
 }