WebUI cleanup: Remove usage of paper-toolbar from CrOS file manager.

This is in preparation of completely removing paper-toolbar from
third_party/polymer.

Bug: None
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: Idf8a0733f751f1e3cd2269682ed9bbf5856cc149
Reviewed-on: https://chromium-review.googlesource.com/683297Reviewed-by: Naoki Fukino <fukino@chromium.org>
Commit-Queue: Demetrios Papadopoulos <dpapad@chromium.org>
Cr-Commit-Position: refs/heads/master@{#504412}

ui/file_manager/file_manager/foreground/elements/files_quick_view.css

@@ -116,10 +116,12 @@ paper-button:focus:not(:active) {
 }
 
 #toolbar {
-  --paper-toolbar-background: rgb(40, 42, 45);
-  --paper-toolbar-height: 48px;
+  align-items: center;
+  background-color: rgb(40, 42, 45);
   color: white;
+  display: flex;
   font-size: 108%;
+  height: 48px;
   margin: 0;
   opacity: 0.9;
   padding: 0;
@@ -127,6 +129,15 @@ paper-button:focus:not(:active) {
   z-index: 1;
 }
 
+#file-path {
+  flex: 1;
+  -webkit-margin-start: 16px;
+}
+
+#buttons {
+  display: flex;
+}
+
 #metadata-button {
   --files-toggle-ripple: {
     background-color: white;
@@ -136,17 +147,6 @@ paper-button:focus:not(:active) {
   };
 }
 
-#buttons {
-  display: flex;
-  position: absolute;
-  right: 0px;
-}
-
-:host-context(html[dir='rtl']) #buttons {
-  right: auto;
-  left: 0px
-}
-
 paper-button,
 files-icon-button {
   border-radius: 2px;

ui/file_manager/file_manager/foreground/elements/files_quick_view.html

@@ -6,7 +6,6 @@
 <link rel="import" href="chrome://resources/polymer/v1_0/polymer/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
-<link rel="import" href="chrome://resources/polymer/v1_0/paper-toolbar/paper-toolbar.html">
 <link rel="import" href="files_icon_button.html">
 <link rel="import" href="files_metadata_box.html">
 <link rel="import" href="files_safe_media.html">
@@ -17,8 +16,8 @@
   <link rel="import" type="css" href="files_quick_view.css">
   <template>
     <dialog id="dialog">
-      <paper-toolbar id="toolbar">
-        <div>[[filePath]]</div>
+      <div id="toolbar">
+        <div id="file-path">[[filePath]]</div>
         <div id="buttons">
            <paper-button id="open-button" on-tap="onOpenInNewButtonTap" hidden$="[[!hasTask]]" i18n-values="aria-label:QUICK_VIEW_OPEN_IN_NEW_BUTTON_LABEL" tabindex="0" has-tooltip>
              <iron-icon icon="files:open-in-new"></iron-icon>
@@ -26,8 +25,8 @@
            <files-icon-button toggles id="metadata-button" on-tap="onMetadataButtonTap_" active="{{metadataBoxActive}}" i18n-values="aria-label:QUICK_VIEW_TOGGLE_METADATA_BOX_BUTTON_LABEL" tabindex="0" has-tooltip>
            </files-icon-button>
         </div>
-	<files-tooltip></files-tooltip>
-      </paper-toolbar>
+        <files-tooltip></files-tooltip>
+      </div>
       <div id="mainPanel">
         <div id="contentPanel" metadata-box-active$="[[metadataBoxActive]]" on-tap="onContentPanelTap_">
           <div id="innerContentPanel" type$="[[type]]" tabindex="0">