2 files changed, 83 insertions, 0 deletions
diff --git a/toolkit/components/reader/content/aboutReader.html b/toolkit/components/reader/content/aboutReader.html
new file mode 100644
index 000000000..b9c1139f6
--- /dev/null
+++ b/toolkit/components/reader/content/aboutReader.html
@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta content="text/html; charset=UTF-8" http-equiv="content-type" />
+  <meta name="viewport" content="width=device-width; user-scalable=0" />
+
+  <link rel="stylesheet" href="chrome://global/skin/aboutReader.css" type="text/css"/>
+
+  <script type="text/javascript;version=1.8" src="chrome://global/content/reader/aboutReader.js"></script>
+</head>
+
+<body>
+  <div id="container" class="container">
+    <div id="reader-header" class="header">
+      <style scoped>
+        @import url("chrome://global/skin/aboutReaderControls.css");
+      </style>
+      <a id="reader-domain" class="domain"></a>
+      <div class="domain-border"></div>
+      <h1 id="reader-title"></h1>
+      <div id="reader-credits" class="credits"></div>
+    </div>
+
+    <div class="content">
+      <style scoped>
+        @import url("chrome://global/skin/aboutReaderContent.css");
+      </style>
+      <div id="moz-reader-content"></div>
+    </div>
+
+    <div>
+      <style scoped>
+        @import url("chrome://global/skin/aboutReaderControls.css");
+      </style>
+      <div id="reader-message"></div>
+    </div>
+  </div>
+
+  <ul id="reader-toolbar" class="toolbar">
+    <style scoped>
+      @import url("chrome://global/skin/aboutReaderControls.css");
+    </style>
+    <li><button id="close-button" class="button close-button"/></li>
+    <ul id="style-dropdown" class="dropdown">
+      <li><button class="dropdown-toggle button style-button"/></li>
+      <li id="reader-popup" class="dropdown-popup">
+        <div id="font-type-buttons"></div>
+        <hr></hr>
+        <div id="font-size-buttons">
+          <button id="font-size-minus" class="minus-button"/>
+          <button id="font-size-sample"/>
+          <button id="font-size-plus" class="plus-button"/>
+        </div>
+        <hr></hr>
+        <div id="content-width-buttons">
+          <button id="content-width-minus" class="content-width-minus-button"/>
+          <button id="content-width-plus" class="content-width-plus-button"/>
+        </div>
+        <hr></hr>
+        <div id="line-height-buttons">
+          <button id="line-height-minus" class="line-height-minus-button"/>
+          <button id="line-height-plus" class="line-height-plus-button"/>
+        </div>
+        <hr></hr>
+        <div id="color-scheme-buttons"></div>
+        <div class="dropdown-arrow"/>
+      </li>
+    </ul>
+  </ul>
+
+</body>
+
+</html>
diff --git a/toolkit/components/reader/content/aboutReader.js b/toolkit/components/reader/content/aboutReader.js
new file mode 100644
index 000000000..17133e69d
--- /dev/null
+++ b/toolkit/components/reader/content/aboutReader.js
@@ -0,0 +1,9 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+window.addEventListener("DOMContentLoaded", function () {
+  document.dispatchEvent(new CustomEvent("AboutReaderContentLoaded", { bubbles: true }));
+});