| #!mojo mojo:sky_viewer |
| <!-- |
| // 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. |
| --> |
| <sky> |
| <import src="/sky/framework/sky-element/sky-element.sky" as="SkyElement" /> |
| <import src="/sky/framework/sky-scrollable.sky" /> |
| <import src="data/cities.sky" as="cities" /> |
| |
| <sky-element name="example-scrollable"> |
| <template> |
| <style> |
| sky-scrollable { |
| margin: 20px; |
| height: 400px; |
| border: 2px solid blue; |
| } |
| b { |
| display: inline; |
| font-weight: bold; |
| } |
| </style> |
| <sky-scrollable> |
| <template repeat="{{ cities }}"> |
| <template> |
| <div>{{ name }}</div> |
| </template> |
| </template> |
| </sky-scrollable> |
| </template> |
| <script> |
| module.exports = class extends SkyElement { |
| created() { |
| this.cities = cities.slice(0, 300); |
| } |
| }.register(); |
| </script> |
| </sky-element> |
| |
| <example-scrollable /> |
| </sky> |