Created
August 13, 2013 12:01
-
-
Save chrisbu/6220424 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| body { | |
| background-color: #F8F8F8; | |
| font-family: 'Open Sans', sans-serif; | |
| font-size: 14px; | |
| font-weight: normal; | |
| line-height: 1.2em; | |
| margin: 15px; | |
| } | |
| h1, p { | |
| color: #333; | |
| } | |
| #sample_container_id { | |
| width: 100%; | |
| height: 400px; | |
| position: relative; | |
| border: 1px solid #ccc; | |
| background-color: #fff; | |
| } | |
| #click_counter { | |
| font-size: 24pt; | |
| text-align: center; | |
| margin-top: 140px; | |
| } | |
| #click_counter button { | |
| font-size: 24pt; | |
| margin-bottom: 20px; | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import 'dart:html'; | |
| void main() { | |
| query("#counter_template").model = 5; | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Sample app</title> | |
| <link rel="stylesheet" href="polymerclicker1.css"> | |
| <!-- import the click-counter --> | |
| <link rel="import" href="xclickcounter.html"> | |
| </head> | |
| <body> | |
| <h1>Polymerclicker1</h1> | |
| <p>Hello world from Dart!</p> | |
| <div id="sample_container_id"> | |
| <template id="counter_template" bind> | |
| <my-clickcounter id="click_counter" count="{{}}"></my-clickcounter> | |
| </template> | |
| </div> | |
| <script type="application/dart" src="polymerclicker1.dart"></script> | |
| <script src="packages/polymer/boot.js"></script> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import 'package:polymer/polymer.dart'; | |
| @CustomTag("my-clickcounter") | |
| class CounterComponent extends PolymerElement | |
| with ObservableMixin { | |
| @observable | |
| int count = 0; | |
| void increment() { | |
| count++; | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <body> | |
| <polymer-element name="my-clickcounter" attributes="count"> | |
| <template> | |
| <div> | |
| <button on-click="increment">Click me</button><br /> | |
| <span>(click count: {{ count }})</span> | |
| </div> | |
| </template> | |
| <script type="application/dart" src="xclickcounter.dart"></script> | |
| </polymer-element> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment