| OLD | NEW |
| 1 <!-- Copyright 2016 The Chromium Authors. All rights reserved. | 1 <!-- Copyright 2016 The Chromium Authors. All rights reserved. |
| 2 -- Use of this source code is governed by a BSD-style license that can be | 2 -- Use of this source code is governed by a BSD-style license that can be |
| 3 -- found in the LICENSE file. | 3 -- found in the LICENSE file. |
| 4 --> | 4 --> |
| 5 | 5 |
| 6 <link rel="import" href="chrome://resources/polymer/v1_0/polymer/polymer.html"> | 6 <link rel="import" href="chrome://resources/polymer/v1_0/polymer/polymer.html"> |
| 7 | 7 |
| 8 <dom-module id="files-metadata-entry"> | 8 <dom-module id="files-metadata-entry"> |
| 9 <style> | 9 <style> |
| 10 div { | 10 div { |
| (...skipping 30 matching lines...) Expand all Loading... |
| 41 overflow-wrap: break-word; | 41 overflow-wrap: break-word; |
| 42 vertical-align: bottom; | 42 vertical-align: bottom; |
| 43 width: 128px; | 43 width: 128px; |
| 44 } | 44 } |
| 45 | 45 |
| 46 #value[loading] { | 46 #value[loading] { |
| 47 font-size: 30px; | 47 font-size: 30px; |
| 48 } | 48 } |
| 49 | 49 |
| 50 #value[loading]:after { | 50 #value[loading]:after { |
| 51 -webkit-animation: ellipsis steps(4,end) 900ms infinite; | |
| 52 animation: ellipsis steps(4,end) 900ms infinite; | 51 animation: ellipsis steps(4,end) 900ms infinite; |
| 53 content: "\2026"; /* ascii code for the ellipsis character */ | 52 content: "\2026"; /* ascii code for the ellipsis character */ |
| 54 display: inline-block; | 53 display: inline-block; |
| 55 overflow: hidden; | 54 overflow: hidden; |
| 56 vertical-align: bottom; | 55 vertical-align: bottom; |
| 57 width: 0px; | 56 width: 0px; |
| 58 } | 57 } |
| 59 | 58 |
| 60 @keyframes ellipsis { | 59 @keyframes ellipsis { |
| 61 to { | 60 to { |
| 62 width: 1.25em; | 61 width: 1.25em; |
| 63 } | 62 } |
| 64 } | 63 } |
| 65 | 64 |
| 66 @-webkit-keyframes ellipsis { | 65 @keyframes ellipsis { |
| 67 to { | 66 to { |
| 68 width: 1.25em; | 67 width: 1.25em; |
| 69 } | 68 } |
| 70 } | 69 } |
| 71 </style> | 70 </style> |
| 72 <template> | 71 <template> |
| 73 <div id="box" hidden="[[!value]]"> | 72 <div id="box" hidden="[[!value]]"> |
| 74 <div id="padding"></div> | 73 <div id="padding"></div> |
| 75 <div id="key">[[key]]</div> | 74 <div id="key">[[key]]</div> |
| 76 <div id="value" loading$="{{loading}}"><div hidden="[[loading]]">[[value]]
</div></div> | 75 <div id="value" loading$="{{loading}}"><div hidden="[[loading]]">[[value]]
</div></div> |
| 77 </div> | 76 </div> |
| 78 </template> | 77 </template> |
| 79 </dom-module> | 78 </dom-module> |
| 80 | 79 |
| 81 <script src="files_metadata_entry.js"></script> | 80 <script src="files_metadata_entry.js"></script> |
| OLD | NEW |