[MD Bookmarks] Add a drag and drop indicator to bookmarks.

chrome/browser/resources/md_bookmarks/shared_style.html

 <link rel="import" href="chrome://bookmarks/shared_vars.html">
 
 <dom-module id="shared-style">
   <template>
     <style>
       [hidden] {
         display: none !important;
       }
 
       button.more-vert-button {
@@ skipping 14 matching lines @@
         background: rgba(0, 0, 0, 0.11);
         border-width: 0;
         height: 1px;
         margin: 8px 0;
       }
 
       paper-button {
         height: 32px;
         margin: 0;
       }
+
+      .drag-above::before,
+      .drag-below::after {
+        background-clip: padding-box;
+        background-color: rgb(66, 133, 244);

[tsergeant, 2017/03/23 00:28:23]

This is #4285F4, which is var(--google-blue-500) and also
var(--folder-active-color).

Pull these two colors out into a single shared variable like
--interactive-color?

[calamity, 2017/03/23 06:12:34]

Done.

+        border: 3px solid rgb(66, 133, 244);
+        border-bottom-color: transparent;
+        border-radius: 0;
+        border-top-color: transparent;
+        box-sizing: border-box;
+        content: '';
+        display: block;
+        height: 8px;
+        left: 0;
+        position: absolute;
+        right: 0;
+        z-index: 10;
+      }
+
+      .drag-above::before {
+        top: 0;
+        transform: translateY(-50%);
+      }
+
+      .drag-below::after {
+        bottom: 0;
+        transform: translateY(50%);
+      }
+
+      .drag-on {
+        background-color: rgba(66, 133, 244, 0.16);
+      }
     </style>
   </template>
 </dom-module>