| OLD | NEW |
|---|
| (Empty) |
| 1 <!-- | |
| 2 // Copyright 2015 The Chromium Authors. All rights reserved. | |
| 3 // Use of this source code is governed by a BSD-style license that can be | |
| 4 // found in the LICENSE file. | |
| 5 --> | |
| 6 <import src="/sky/framework/elements/material-element.sky" /> | |
| 7 <import src="/sky/framework/elements/sky-element.sky" /> | |
| 8 <import src="stock-arrow.sky" /> | |
| 9 | |
| 10 <sky-element> | |
| 11 <template> | |
| 12 <style> | |
| 13 :host { | |
| 14 // TODO(eseidel): Why does setting height here make this too big? | |
| 15 // height: 48px; | |
| 16 max-height: 48px; | |
| 17 display: flex; | |
| 18 align-items: center; | |
| 19 border-bottom: 1px solid #F4F4F4; | |
| 20 padding-top: 16px; | |
| 21 padding-left: 16px; | |
| 22 padding-right: 16px; | |
| 23 padding-bottom: 20px; | |
| 24 } | |
| 25 stock-arrow { | |
| 26 margin-right: 16px; | |
| 27 } | |
| 28 #ticker { | |
| 29 flex: 1; | |
| 30 font-family: 'Roboto Medium', 'Helvetica'; | |
| 31 } | |
| 32 #last-sale { | |
| 33 text-align: right; | |
| 34 padding-right: 16px; | |
| 35 } | |
| 36 #change { | |
| 37 color: #8A8A8A; | |
| 38 text-align: right; | |
| 39 } | |
| 40 </style> | |
| 41 <stock-arrow id="arrow" /> | |
| 42 <div id="ticker" /> | |
| 43 <div id="last-sale" /> | |
| 44 <div id="change" /> | |
| 45 </template> | |
| 46 <script> | |
| 47 import "dart:sky"; | |
| 48 | |
| 49 @Tagname('stock') | |
| 50 class Stock extends MaterialElement { | |
| 51 var model; // model.Stock | |
| 52 | |
| 53 void shadowRootReady() { | |
| 54 shadowRoot.getElementById('ticker').textContent = model.symbol; | |
| 55 | |
| 56 Element lastSale = shadowRoot.getElementById('last-sale'); | |
| 57 lastSale.textContent = "\$${model.lastSale.toStringAsFixed(2)}"; | |
| 58 | |
| 59 Element change = shadowRoot.getElementById('change'); | |
| 60 String changeString = "${model.percentChange.toStringAsFixed(2)}%"; | |
| 61 if (model.percentChange > 0) | |
| 62 changeString = "+" + changeString; | |
| 63 change.textContent = changeString; | |
| 64 | |
| 65 StockArrow arrow = shadowRoot.getElementById('arrow'); | |
| 66 arrow.change = model.percentChange; | |
| 67 } | |
| 68 } | |
| 69 | |
| 70 _init(script) => register(script, Stock); | |
| 71 </script> | |
| 72 </sky-element> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1022613002:
Remove custom elements examples, they are no longer maintained (Closed)
Base URL: git@github.com:domokit/mojo.git@master