OLD | NEW |
| (Empty) |
1 <!-- | |
2 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. | |
3 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | |
4 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | |
5 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | |
6 Code distributed by Google as part of the polymer project is also | |
7 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | |
8 --><!-- | |
9 The progress bars are for situations where the percentage completed can be | |
10 determined. They give users a quick sense of how much longer an operation | |
11 will take. | |
12 | |
13 Example: | |
14 | |
15 <paper-progress value="10"></paper-progress> | |
16 | |
17 There is also a secondary progress which is useful for displaying intermediate | |
18 progress, such as the buffer level during a streaming playback progress bar. | |
19 | |
20 Example: | |
21 | |
22 <paper-progress value="10" secondaryProgesss="30"></paper-progress> | |
23 | |
24 Styling progress bar: | |
25 | |
26 To change the active progress bar color: | |
27 | |
28 paper-progress::shadow #activeProgress { | |
29 background-color: #e91e63; | |
30 } | |
31 | |
32 To change the secondary progress bar color: | |
33 | |
34 paper-progress::shadow #secondaryProgress { | |
35 background-color: #f8bbd0; | |
36 } | |
37 | |
38 To change the progress bar background color: | |
39 | |
40 paper-progress::shadow #progressContainer { | |
41 background-color: #64ffda; | |
42 } | |
43 | |
44 @group Paper Elements | |
45 @element paper-progress | |
46 @extends core-range | |
47 @homepage github.io | |
48 --><html><head><link rel="import" href="../core-range/core-range.html"> | |
49 | |
50 </head><body><polymer-element name="paper-progress" extends="core-range" attribu
tes="secondaryProgress indeterminate" assetpath=""> | |
51 | |
52 <template> | |
53 | |
54 <link rel="stylesheet" href="paper-progress.css"> | |
55 | |
56 <div id="progressContainer" role="progressbar" aria-valuenow="{{value}}" ari
a-valuemin="{{min}}" aria-valuemax="{{max}}"> | |
57 | |
58 <div id="secondaryProgress" fit=""></div> | |
59 <div id="activeProgress" fit=""></div> | |
60 | |
61 </div> | |
62 | |
63 </template> | |
64 | |
65 | |
66 | |
67 </polymer-element> | |
68 <script charset="utf-8" src="paper-progress-extracted.js"></script></body></html
> | |
OLD | NEW |