| Index: third_party/polymer/v1_0/components-chromium/paper-progress/README.md
|
| diff --git a/third_party/polymer/v1_0/components-chromium/paper-progress/README.md b/third_party/polymer/v1_0/components-chromium/paper-progress/README.md
|
| index a2b5c7d161be2829483ab4730400926b269c867b..a55c09e7731d4f23784acd1e70222d2f9d2182a0 100644
|
| --- a/third_party/polymer/v1_0/components-chromium/paper-progress/README.md
|
| +++ b/third_party/polymer/v1_0/components-chromium/paper-progress/README.md
|
| @@ -1,5 +1,23 @@
|
| -paper-progress
|
| -===================
|
| +
|
| +<!---
|
| +
|
| +This README is automatically generated from the comments in these files:
|
| +paper-progress.html
|
| +
|
| +Edit those files, and our readme bot will duplicate them over here!
|
| +Edit this file, and the bot will squash your changes :)
|
| +
|
| +-->
|
| +
|
| +[](https://travis-ci.org/PolymerElements/paper-progress)
|
| +
|
| +_[Demo and API Docs](https://elements.polymer-project.org/elements/paper-progress)_
|
| +
|
| +
|
| +##<paper-progress>
|
| +
|
| +
|
| +Material design: [Progress & activity](https://www.google.com/design/spec/components/progress-activity.html)
|
|
|
| The progress bars are for situations where the percentage completed can be
|
| determined. They give users a quick sense of how much longer an operation
|
| @@ -7,66 +25,56 @@ will take.
|
|
|
| Example:
|
|
|
| -```html
|
| -<paper-progress value="10"></paper-progress>
|
| -```
|
| + <paper-progress value="10"></paper-progress>
|
|
|
| There is also a secondary progress which is useful for displaying intermediate
|
| progress, such as the buffer level during a streaming playback progress bar.
|
|
|
| Example:
|
|
|
| -```html
|
| -<paper-progress value="10" secondary-progress="30"></paper-progress>
|
| -```
|
| + <paper-progress value="10" secondary-progress="30"></paper-progress>
|
|
|
| ### Styling progress bar:
|
|
|
| To change the active progress bar color:
|
|
|
| -```css
|
| -paper-progress {
|
| - --paper-progress-active-color: #e91e63;
|
| -}
|
| -```
|
| + paper-progress {
|
| + --paper-progress-active-color: #e91e63;
|
| + }
|
|
|
| To change the secondary progress bar color:
|
|
|
| -```css
|
| -paper-progress {
|
| - --paper-progress-secondary-color: #f8bbd0;
|
| -}
|
| -```
|
| + paper-progress {
|
| + --paper-progress-secondary-color: #f8bbd0;
|
| + }
|
|
|
| To change the progress bar background color:
|
|
|
| -```css
|
| -paper-progress {
|
| - --paper-progress-container-color: #64ffda;
|
| -}
|
| -```
|
| + paper-progress {
|
| + --paper-progress-container-color: #64ffda;
|
| + }
|
|
|
| -Add the class `transiting` to a `<paper-progress>` to animate the progress bar when
|
| +Add the class `transiting` to a paper-progress to animate the progress bar when
|
| the value changed. You can also customize the transition:
|
|
|
| -```css
|
| -paper-progress {
|
| - --paper-progress-transition-duration: 0.08s;
|
| - --paper-progress-transition-timing-function: ease;
|
| - --paper-progress-transition-transition-delay: 0s;
|
| -}
|
| -```
|
| + paper-progress {
|
| + --paper-progress-transition-duration: 0.08s;
|
| + --paper-progress-transition-timing-function: ease;
|
| + --paper-progress-transition-transition-delay: 0s;
|
| + }
|
|
|
| The following mixins are available for styling:
|
|
|
| -Custom property | Description | Default
|
| ---------------------------------------------|---------------------------------------------|----------
|
| ---paper-progress-container-color | Mixin applied to container | --google-grey-300
|
| ---paper-progress-transition-duration | Duration of the transition | 0.008s
|
| ---paper-progress-transition-timing-function | The timing function for the transition | ease
|
| ---paper-progress-transition-delay | delay for the transition | 0s
|
| ---paper-progress-active-color | The color of the active bar | --google-green-500
|
| ---paper-progress-secondary-color | The color of the secondary bar | --google-green-100
|
| ---paper-progress-disabled-active-color | The color of the active bar if disabled | --google-grey-500
|
| ---paper-progress-disabled-secondary-color | The color of the secondary bar if disabled | --google-grey-300
|
| ---paper-progress-height | The height of the progress bar | 4px
|
| +Custom property | Description | Default
|
| +----------------------------------------------|---------------------------------------------|--------------
|
| +`--paper-progress-container-color` | Mixin applied to container | `--google-grey-300`
|
| +`--paper-progress-transition-duration` | Duration of the transition | `0.008s`
|
| +`--paper-progress-transition-timing-function` | The timing function for the transition | `ease`
|
| +`--paper-progress-transition-delay` | delay for the transition | `0s`
|
| +`--paper-progress-active-color` | The color of the active bar | `--google-green-500`
|
| +`--paper-progress-secondary-color` | The color of the secondary bar | `--google-green-100`
|
| +`--paper-progress-disabled-active-color` | The color of the active bar if disabled | `--google-grey-500`
|
| +`--paper-progress-disabled-secondary-color` | The color of the secondary bar if disabled | `--google-grey-300`
|
| +`--paper-progress-height` | The height of the progress bar | `4px`
|
| +
|
| +
|
|
|