Implement basic toolbar with Material Design and loading progress.

chrome/browser/resources/pdf/index-material.css

Index: chrome/browser/resources/pdf/index-material.css
diff --git a/chrome/browser/resources/pdf/index-material.css b/chrome/browser/resources/pdf/index-material.css
new file mode 100644
index 0000000000000000000000000000000000000000..c61ed484c2dd6d894d2e9d88219fb9c3243e2c69
--- /dev/null
+++ b/chrome/browser/resources/pdf/index-material.css
@@ -0,0 +1,44 @@
+/* Copyright 2015 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. */
+
+@font-face {
+  font-family: 'Roboto';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Roboto Regular'), local('Roboto-Regular'), url(chrome://resources/roboto/roboto.woff2) format('woff2');
+  unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
+}
+
+body {
+  font-family: RobotoDraft, Roboto, 'Helvetica Neue', Helvetica, Arial;

[raymes, 2015/01/13 04:32:01]

Do we want RobotoDraft there?

[Alexandre Carlton, 2015/01/13 05:21:43]

RobotoDraft is the default for Polymer, so if it's available then I thought it
should be used. I've removed it now.

+}
+
+core-toolbar {
+  background-color: transparent;
+  color: rgb(241, 241, 241);
+  font-size: 2em;
+  height: 64px;
+  z-index: 3;
+}
+
+#toolbar-shadow {
+  position: fixed;
+  width: 100%;
+  z-index: 4;
+}
+
+#progress-bar {
+  height: 64px;
+  position: absolute;
+  width: 100%;
+  z-index: 3;
+}
+
+paper-progress::shadow #activeProgress {
+  background-color: rgb(33, 150, 243);
+}
+
+paper-progress::shadow #progressContainer {
+  background-color: rgb(100, 181, 246);
+}