OLD | NEW |
1 <!-- | 1 <!-- |
2 Copyright 2014 The Chromium Authors. All rights reserved. | 2 Copyright 2014 The Chromium Authors. All rights reserved. |
3 Use of this source code is governed by a BSD-style license that can be | 3 Use of this source code is governed by a BSD-style license that can be |
4 found in the LICENSE file. | 4 found in the LICENSE file. |
5 --> | 5 --> |
6 | 6 |
7 <link rel="import" href="ct-builder-grid.html"> | 7 <link rel="import" href="ct-builder-grid.html"> |
8 <link rel="import" href="ct-commit-list.html"> | 8 <link rel="import" href="ct-commit-list.html"> |
9 <link rel="import" href="ct-test-list.html"> | 9 <link rel="import" href="ct-test-list.html"> |
10 | 10 |
11 <polymer-element name="ct-failure-card" attributes="failures"> | 11 <polymer-element name="ct-failure-card" attributes="failures"> |
12 <template> | 12 <template> |
13 <style> | 13 <style> |
14 :host { | 14 :host { |
15 display: flex; | 15 display: flex; |
16 } | 16 } |
17 | 17 |
| 18 /* FIXME: All this paper-button styling should go in a cr-button component
so that |
| 19 we can use buttons in different places and have them all look the same.
*/ |
18 paper-button { | 20 paper-button { |
19 background: papayawhip; | 21 -webkit-user-select: none; |
| 22 background: #f5f5f5; |
| 23 border-radius: 2px; |
| 24 border: 1px solid #dcdcdc; |
| 25 color: #444; |
| 26 padding: 0 16px; |
| 27 text-align: center; |
| 28 } |
| 29 |
| 30 paper-button:focus { |
| 31 border: 1px solid #4d90fe; |
| 32 outline: none; |
| 33 } |
| 34 |
| 35 paper-button:active { |
| 36 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3); |
| 37 } |
| 38 |
| 39 paper-button:active, paper-button:hover { |
| 40 background: #f8f8f8; |
| 41 border-color: #c6c6c6; |
| 42 box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1); |
| 43 color: #222; |
20 } | 44 } |
21 | 45 |
22 ct-builder-grid { | 46 ct-builder-grid { |
23 margin-right: 10px; | 47 margin-right: 10px; |
24 } | 48 } |
| 49 |
| 50 .failure { |
| 51 flex: 1; |
| 52 } |
| 53 |
| 54 #examine { |
| 55 align-self: flex-start; |
| 56 } |
25 </style> | 57 </style> |
26 <ct-builder-grid failures="{{failures}}"></ct-builder-grid> | 58 <ct-builder-grid failures="{{failures}}"></ct-builder-grid> |
27 <div style="flex: 1"> | 59 <div class="failure"> |
28 <ct-test-list tests="{{failures|testNames}}"></ct-test-list> | 60 <ct-test-list tests="{{failures|testNames}}"></ct-test-list> |
29 <ct-commit-list first="{{failures[0].newestPassingRevision + 1}}" | 61 <ct-commit-list first="{{failures[0].newestPassingRevision + 1}}" |
30 last="{{failures[0].oldestFailingRevision}}"></ct-commit-l
ist> | 62 last="{{failures[0].oldestFailingRevision}}"></ct-commit-l
ist> |
31 </div> | 63 </div> |
32 <div> | 64 <paper-button id="examine" on-tap="{{examine}}">Examine</paper-button> |
33 <paper-button id="examine" on-tap="{{examine}}">Examine</paper-button> | |
34 </div> | |
35 </template> | 65 </template> |
36 <script> | 66 <script> |
37 Polymer({ | 67 Polymer({ |
38 failures: [], | 68 failures: [], |
39 | 69 |
40 testNames: function(failures) { | 70 testNames: function(failures) { |
41 return failures.map(function(failureAnalysis) { return failureAnalysis.t
estName }); | 71 return failures.map(function(failureAnalysis) { return failureAnalysis.t
estName }); |
42 }, | 72 }, |
43 | 73 |
44 examine: function() { | 74 examine: function() { |
45 this.fire('ct-examine-failures', this.failures); | 75 this.fire('ct-examine-failures', this.failures); |
46 }, | 76 }, |
47 }); | 77 }); |
48 </script> | 78 </script> |
49 </polymer-element> | 79 </polymer-element> |
OLD | NEW |