[MD Bookmarks] Add skeleton for MD Bookmarks.

chrome/browser/resources/md_bookmarks/toolbar.html

Index: chrome/browser/resources/md_bookmarks/toolbar.html
diff --git a/chrome/browser/resources/md_bookmarks/toolbar.html b/chrome/browser/resources/md_bookmarks/toolbar.html
new file mode 100644
index 0000000000000000000000000000000000000000..751a6c6a29b51a35cd442911c7e0a1ec02b39d67
--- /dev/null
+++ b/chrome/browser/resources/md_bookmarks/toolbar.html
@@ -0,0 +1,79 @@
+<link rel="import" href="chrome://resources/html/polymer.html">
+<link rel="import" href="chrome://resources/cr_elements/cr_action_menu/cr_action_menu.html">
+<link rel="import" href="chrome://resources/cr_elements/cr_toolbar/cr_toolbar.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html">
+<link rel="import" href="chrome://bookmarks/shared_style.html">
+<link rel="stylesheet" href="chrome://resources/css/md_colors.css">
+
+<dom-module id="bookmarks-toolbar">
+  <template>
+    <style include="shared-style">
+      :host {
+        width: 100%;

[tsergeant, 2016/12/22 04:33:02]

This shouldn't be necessary.

[angelayang, 2016/12/28 00:49:38]

Done.

+      }
+
+      button.more-actions {
+        -webkit-margin-end: 12px;

[tsergeant, 2016/12/22 04:33:02]

Change this to 4px.

When you compare Bookmarks and Downloads, the menu buttons should be in
identical positions.

[angelayang, 2016/12/28 00:49:38]

Done.

+      }
+
+      button.more-vert-button div {
+        border-color: white;
+      }
+
+      cr-toolbar {
+        align-items: center;

[tsergeant, 2016/12/22 04:33:02]

Delete the align-items and display lines. I think they're no longer necessary.

[angelayang, 2016/12/28 00:49:38]

Done.

+        background: var(--md-toolbar-color);
+        display: flex;
+      }
+
+      cr-toolbar {

[tsergeant, 2016/12/22 04:33:02]

Delete this block and the next one. I've fixed cr-toolbar to not need all this
stuff anymore.

You might need to adjust the margins on the menu button accordingly. (See above)

[angelayang, 2016/12/28 00:49:38]

Cool it seems to be in same position as downloads, but the search bar isn't the
same length. I'm not sure why this is so..?

+        --cr-toolbar-field-end-padding: 0;
+        --cr-toolbar-field-margin: var(--sidebar-width);
+        --cr-toolbar-right-content-wide: {
+          position: absolute;
+          right: 0;
+        };
+      }
+
+      :host-context([dir=rtl]) cr-toolbar {
+        --cr-toolbar-right-content-wide: {
+          position: absolute;
+          left: 0;
+        };
+      }
+    </style>
+    <dialog is="cr-action-menu" id="dropdown">
+      <button class="dropdown-item" on-tap="onBulkEditTap_">
+        $i18n{menuBulkEdit}
+      </button>
+      <button class="dropdown-item" on-tap="onSortTap_">
+        $i18n{menuSort}
+      </button>
+      <hr>
+      <button class="dropdown-item" on-tap="onAddBookmarkTap_">
+        $i18n{menuAddBookmark}
+      </button>
+      <button class="dropdown-item" on-tap="onAddFolderTap_">
+        $i18n{menuAddFolder}
+      </button>
+      <hr>
+      <button class="dropdown-item" on-tap="onImportTap_">
+        $i18n{menuImport}
+      </button>
+      <button class="dropdown-item" on-tap="onExportTap_">
+        $i18n{menuExport}
+      </button>
+    </dialog>
+    <cr-toolbar page-name="$i18n{title}"
+        clear-label="$i18n{clearSearch}"
+        search-prompt="$i18n{searchPrompt}">
+      <button is="paper-icon-button-light" class="more-actions more-vert-button"
+          on-tap="onMenuButtonOpenTap_">
+        <div></div>
+        <div></div>
+        <div></div>
+      </button>
+    </cr-toolbar>
+  </template>
+  <script src="chrome://bookmarks/toolbar.js"></script>
+</dom-module>