59 lines
1.4 KiB
HTML
59 lines
1.4 KiB
HTML
|
<!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="../webcomponentsjs/webcomponents.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>
|
||
|
|
|
||
|
|
|