Index: third_party/polymer/components-chromium/core-style/demo.html |
diff --git a/third_party/polymer/components-chromium/core-style/demo.html b/third_party/polymer/components-chromium/core-style/demo.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..0681c6cca706632380a04e6ea9106a5e041564a1 |
--- /dev/null |
+++ b/third_party/polymer/components-chromium/core-style/demo.html |
@@ -0,0 +1,58 @@ |
+<!DOCTYPE html> |
+<!-- |
+Copyright 2013 The Polymer Authors. All rights reserved. |
+Use of this source code is governed by a BSD-style |
+license that can be found in the LICENSE file. |
+--> |
+<html> |
+<head> |
+ <title>core-style</title> |
+ <script src="../platform/platform.js"></script> |
+ |
+ <link rel="import" href="elements.html"> |
+ <link rel="import" href="my-theme.html"> |
+ |
+</head> |
+<body unresolved fullbleed vertical layout> |
+ <core-style ref="main"></core-style> |
+ |
+ <template is="auto-binding"> |
+ <my-toolbar> |
+ <span flex>core-style</span> |
+ <input type="color" value="{{g.theme.colorOne}}"> |
+ <input type="color" value="{{g.theme.colorTwo}}"> |
+ <input type="color" value="{{g.theme.colorThree}}"> |
+ <input type="range" min="1" max="8" value="{{g.columns}}"> |
+ <button>A button</button> |
+ </my-toolbar> |
+ <section flex horizontal wrap layout> |
+ <template repeat="{{item in items}}"> |
+ <my-panel>{{item}}</my-panel> |
+ </template> |
+ </section> |
+ </template> |
+ |
+ <script> |
+ (function() { |
+ |
+ addEventListener('polymer-ready', function() { |
+ var items = []; |
+ for (var i=0; i < 100; i++) { |
+ items.push(i); |
+ } |
+ |
+ CoreStyle.g.items = items; |
+ |
+ addEventListener('template-bound', function(e) { |
+ e.target.g = CoreStyle.g; |
+ e.target.items = items; |
+ }); |
+ }); |
+ |
+ })(); |
+ </script> |
+ |
+</body> |
+</html> |
+ |
+ |