third_party/polymer/v1_0/components-chromium/paper-progress/paper-progress.html - Issue 1336623003: [MD settings] updating polymer to 1.1.13

Unified Diff: third_party/polymer/v1_0/components-chromium/paper-progress/paper-progress.html

Issue 1336623003: [MD settings] updating polymer to 1.1.13 (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: changed Polymer.IronCheckedElementBehavior name Created 5 years, 3 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View side-by-side diff with in-line comments

Download patch

« no previous file with comments | « third_party/polymer/v1_0/components-chromium/paper-progress/bower.json ('k') | third_party/polymer/v1_0/components-chromium/paper-progress/paper-progress-extracted.js » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

Index: third_party/polymer/v1_0/components-chromium/paper-progress/paper-progress.html

diff --git a/third_party/polymer/v1_0/components-chromium/paper-progress/paper-progress.html b/third_party/polymer/v1_0/components-chromium/paper-progress/paper-progress.html

index 9a0e813c7ab1c6585c22594ac50a6e33aa2dd5be..adc7090d25d31fdaaef691b775840966c1bc2398 100644

--- a/third_party/polymer/v1_0/components-chromium/paper-progress/paper-progress.html

+++ b/third_party/polymer/v1_0/components-chromium/paper-progress/paper-progress.html

@@ -8,8 +8,8 @@ Code distributed by Google as part of the polymer project is also

subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt

--><html><head><link rel="import" href="../polymer/polymer.html">

+<link rel="import" href="../paper-styles/paper-styles-classes.html">

-<link rel="import" href="../iron-flex-layout/classes/iron-flex-layout.html">

<!--

The progress bars are for situations where the percentage completed can be

@@ -55,17 +55,20 @@ the value changed. You can also customize the transition:

--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` | Mixin applied to container | `{}`

+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

@group Paper Elements

@element paper-progress

@@ -76,13 +79,34 @@ Custom property | Description | Default

</head><body><dom-module id="paper-progress">

<style>

:host {

- display: inline-block;

+ display: block;

width: 200px;

- height: 4px;

+ position: relative;

+ overflow: hidden;

+ }

+ #progressContainer {

+ position: relative;

+ }

+ #progressContainer,

+ /* the stripe for the indeterminate animation*/

+ .indeterminate:after {

+ height: var(--paper-progress-height, 4px);

+ }

+ #primaryProgress,

+ #secondaryProgress,

+ .indeterminate:after {

+ @apply(--layout-fit);

}

- :host(.transiting) #activeProgress,

- :host(.transiting) #secondaryProgress {

+ #progressContainer,

+ .indeterminate:after {

+ background-color: var(--paper-progress-container-color, --google-grey-300);

+ }

+ :host(.transiting) > * {

-webkit-transition-property: -webkit-transform;

transition-property: transform;

@@ -99,48 +123,45 @@ Custom property | Description | Default

transition-delay: var(--paper-progress-transition-delay, 0s);

}

- #progressContainer {

- position: relative;

- height: 100%;

- overflow: hidden;

- @apply(--paper-progress-container);

- }

- #progressContainer, #indeterminateSplitter {

- background-color: var(--paper-progress-container-color, --google-grey-300);

- }

- #activeProgress,

+ #primaryProgress,

#secondaryProgress {

+ @apply(--layout-fit);

-webkit-transform-origin: left center;

transform-origin: left center;

-webkit-transform: scaleX(0);

transform: scaleX(0);

+ will-change: transform;

}

- #activeProgress {

+ #primaryProgress {

background-color: var(--paper-progress-active-color, --google-green-500);

}

#secondaryProgress {

+ position: relative;

background-color: var(--paper-progress-secondary-color, --google-green-100);

}

- #indeterminateSplitter {

- display: none;

+ :host([disabled]) #primaryProgress {

+ background-color: var(--paper-progress-disabled-active-color, --google-grey-500);

+ }

+ :host([disabled]) #secondaryProgress {

+ background-color: var(--paper-progress-disabled-active-color, --google-grey-300);

}

- #activeProgress.indeterminate {

+ :host(:not([disabled])) #primaryProgress.indeterminate {

-webkit-transform-origin: right center;

transform-origin: right center;

-webkit-animation: indeterminate-bar 2s linear infinite;

animation: indeterminate-bar 2s linear infinite;

}

- #indeterminateSplitter.indeterminate {

- display: block;

+ :host(:not([disabled])) #primaryProgress.indeterminate:after {

+ content: "";

-webkit-transform-origin: center center;

transform-origin: center center;

-webkit-animation: indeterminate-splitter 2s linear infinite;

animation: indeterminate-splitter 2s linear infinite;

}

@@ -210,10 +231,9 @@ Custom property | Description | Default

}

</style>

- <div id="progressContainer" role="progressbar" aria-valuenow$="{{value}}" aria-valuemin$="{{min}}" aria-valuemax$="{{max}}">

- <div id="secondaryProgress" class="fit"></div>

- <div id="activeProgress" class="fit"></div>

- <div id="indeterminateSplitter" class="fit"></div>

+ <div id="progressContainer">

+ <div id="secondaryProgress" hidden$="[[_hideSecondaryProgress(secondaryRatio)]]"></div>

+ <div id="primaryProgress"></div>

</div>

</template>

</dom-module>