6 files changed, 73 insertions, 0 deletions
diff --git a/addon-sdk/source/examples/theme/data/icon-16.png b/addon-sdk/source/examples/theme/data/icon-16.png
new file mode 100644
index 000000000..72327f77b
--- /dev/null
+++ b/addon-sdk/source/examples/theme/data/icon-16.png
diff --git a/addon-sdk/source/examples/theme/data/index.html b/addon-sdk/source/examples/theme/data/index.html
new file mode 100644
index 000000000..24ffc1a04
--- /dev/null
+++ b/addon-sdk/source/examples/theme/data/index.html
@@ -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/. -->
+<html>
+  <head>
+  </head>
+  <body>
+  </body>
+</html>
diff --git a/addon-sdk/source/examples/theme/data/theme.css b/addon-sdk/source/examples/theme/data/theme.css
new file mode 100644
index 000000000..c837960d9
--- /dev/null
+++ b/addon-sdk/source/examples/theme/data/theme.css
@@ -0,0 +1,7 @@
+/* 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/. */
+
+#devtools-theme-box {
+  background-color: red !important;
+}
diff --git a/addon-sdk/source/examples/theme/lib/main.js b/addon-sdk/source/examples/theme/lib/main.js
new file mode 100644
index 000000000..3b71376a5
--- /dev/null
+++ b/addon-sdk/source/examples/theme/lib/main.js
@@ -0,0 +1,37 @@
+/* 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";
+
+const { Tool } = require("dev/toolbox");
+const { Class } = require("sdk/core/heritage");
+const { onEnable, onDisable } = require("dev/theme/hooks");
+const { Theme, LightTheme } = require("dev/theme");
+
+/**
+ * This object represents a new theme registered within the Toolbox.
+ * You can activate it by clicking on "My Light Theme" theme option
+ * in the Options panel.
+ * Note that the new theme derives styles from built-in Light theme.
+ */
+const MyTheme = Theme({
+  name: "mytheme",
+  label: "My Light Theme",
+  styles: [LightTheme, "./theme.css"],
+
+  onEnable: function(window, oldTheme) {
+    console.log("myTheme.onEnable; method override " +
+      window.location.href);
+  },
+  onDisable: function(window, newTheme) {
+    console.log("myTheme.onDisable; method override " +
+      window.location.href);
+  },
+});
+
+// Registration
+
+const mytheme = new Tool({
+  name: "My Tool",
+  themes: { mytheme: MyTheme }
+});
diff --git a/addon-sdk/source/examples/theme/package.json b/addon-sdk/source/examples/theme/package.json
new file mode 100644
index 000000000..bb18a78ae
--- /dev/null
+++ b/addon-sdk/source/examples/theme/package.json
@@ -0,0 +1,10 @@
+{
+  "name": "theme",
+  "title": "theme",
+  "id": "theme@jetpack",
+  "description": "How to create new theme for devtools",
+  "author": "Jan Odvarko",
+  "license": "MPL-2.0",
+  "version": "0.1.0",
+  "main": "lib/main"
+}
diff --git a/addon-sdk/source/examples/theme/test/test-main.js b/addon-sdk/source/examples/theme/test/test-main.js
new file mode 100644
index 000000000..8a5e101d3
--- /dev/null
+++ b/addon-sdk/source/examples/theme/test/test-main.js
@@ -0,0 +1,10 @@
+/* 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";
+
+exports.testMain = function(assert) {
+  assert.pass("TODO: Write some tests.");
+};
+
+require("sdk/test").run(exports);