| Index: third_party/polymer/components-chromium/core-animated-pages/transitions/cross-fade.html
|
| diff --git a/third_party/polymer/components-chromium/core-animated-pages/transitions/cross-fade.html b/third_party/polymer/components-chromium/core-animated-pages/transitions/cross-fade.html
|
| deleted file mode 100644
|
| index 4bfdf02a6046ff93fbf5da60aa61a4332b0ea859..0000000000000000000000000000000000000000
|
| --- a/third_party/polymer/components-chromium/core-animated-pages/transitions/cross-fade.html
|
| +++ /dev/null
|
| @@ -1,173 +0,0 @@
|
| -<!--
|
| -Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
|
| -This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
|
| -The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
|
| -The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
|
| -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
|
| --->
|
| -
|
| -<link href="core-transition-pages.html" rel="import">
|
| -
|
| -<core-style id="cross-fade">
|
| - polyfill-next-selector { content: ':host > * [cross-fade]'; }
|
| - ::content > * /deep/ [cross-fade] {
|
| - -webkit-transition: opacity {{g.transitions.xfadeDuration || g.transitions.duration}} cubic-bezier(0.4, 0, 0.2, 1);
|
| - transition: opacity {{g.transitions.xfadeDuration || g.transitions.duration}} cubic-bezier(0.4, 0, 0.2, 1);
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host > * [cross-fade][bg]'; }
|
| - ::content > * /deep/ [cross-fade][bg] {
|
| - -webkit-transition: background-color {{g.transitions.xfadeDuration || g.transitions.duration}} cubic-bezier(0.4, 0, 0.2, 1);
|
| - transition: background-color {{g.transitions.xfadeDuration || g.transitions.duration}} cubic-bezier(0.4, 0, 0.2, 1);
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host > * [cross-fade][hero-p]'; }
|
| - ::content > * /deep/ [cross-fade][hero-p] {
|
| - -webkit-transition: background-color {{g.transitions.xfadeDuration || g.transitions.duration}} cubic-bezier(0.4, 0, 0.2, 1);
|
| - transition: background-color {{g.transitions.xfadeDuration || g.transitions.duration}} cubic-bezier(0.4, 0, 0.2, 1);
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host > .core-selected [cross-fade]'; }
|
| - ::content > .core-selected /deep/ [cross-fade] {
|
| - opacity: 1;
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host > [animate]:not(.core-selected) [cross-fade]:not([hero-p]):not([bg])'; }
|
| - ::content > [animate]:not(.core-selected) /deep/ [cross-fade]:not([hero-p]):not([bg]) {
|
| - opacity: 0;
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host > [animate]:not(.core-selected) [cross-fade][bg]'; }
|
| - ::content > [animate]:not(.core-selected) /deep/ [cross-fade][bg] {
|
| - background-color: rgba(0, 0, 0, 0);
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host > [animate]:not(.core-selected) [cross-fade][hero-p]'; }
|
| - ::content > [animate]:not(.core-selected) /deep/ [cross-fade][hero-p] {
|
| - background-color: rgba(0, 0, 0, 0);
|
| - }
|
| -</core-style>
|
| -
|
| -<core-style id="cross-fade-delayed">
|
| - polyfill-next-selector { content: ':host > * [cross-fade-delayed]'; }
|
| - ::content > * /deep/ [cross-fade-delayed] {
|
| - -webkit-transition: opacity {{g.transitions.xfadeDuration || g.transitions.duration}} ease-out;
|
| - transition: opacity {{g.transitions.xfadeDuration || g.transitions.duration}} ease-out;
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host > .core-selected [cross-fade-delayed]'; }
|
| - ::content > .core-selected /deep/ [cross-fade-delayed] {
|
| - -webkit-transition: opacity {{g.transitions.xfadeDuration || g.transitions.duration}} ease-out {{g.transitions.xfadeDelay || g.transitions.xfadeDuration || g.transitions.duration}};
|
| - transition: opacity {{g.transitions.xfadeDuration || g.transitions.duration}} ease-out {{g.transitions.xfadeDelay || g.transitions.xfadeDuration || g.transitions.duration}};
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host > [animate]:not(.core-selected) [cross-fade-delayed]'; }
|
| - ::content > [animate]:not(.core-selected) /deep/ [cross-fade-delayed] {
|
| - opacity: 0;
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host > .core-selected [cross-fade-delayed]'; }
|
| - ::content > .core-selected /deep/ [cross-fade-delayed] {
|
| - opacity: 1;
|
| - }
|
| -
|
| -</core-style>
|
| -
|
| -<core-style id="cross-fade-all">
|
| - /* cross-fade-all: cross fade everything except for heroes and their parents */
|
| - polyfill-next-selector { content: ':host(.cross-fade-all) > * *:not([hero]):not([hero-p]):not([cross-fade])'; }
|
| - :host(.cross-fade-all) ::content > * /deep/ *:not([hero]):not([hero-p]):not([cross-fade]) {
|
| - -webkit-transition: opacity {{g.transitions.xfadeDuration || g.transitions.duration}} ease-out;
|
| - transition: opacity {{g.transitions.xfadeDuration || g.transitions.duration}} ease-out;
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host(.cross-fade-all) > [animate]:not(.core-selected) *:not([hero]):not([hero-p]):not([cross-fade])'; }
|
| - :host(.cross-fade-all) ::content > [animate]:not(.core-selected) /deep/ *:not([hero]):not([hero-p]):not([cross-fade]) {
|
| - opacity: 0;
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host(.cross-fade-all) > .core-selected *:not([hero])'; }
|
| - .host(.cross-fade-all) ::content > .core-selected /deep/ * {
|
| - opacity: 1;
|
| - }
|
| -
|
| - /* Only background-color is allowed for the hero's parents, no opacity transitions */
|
| - polyfill-next-selector { content: ':host(.cross-fade-all) > * [hero-p]'; }
|
| - :host(.cross-fade-all) ::content > * /deep/ [hero-p] {
|
| - -webkit-transition: background-color {{g.transitions.xfadeDuration || g.transitions.duration}} ease-out;
|
| - transition: background-color {{g.transitions.xfadeDuration || g.transitions.duration}} ease-out;
|
| - opacity: 1;
|
| - }
|
| -
|
| - polyfill-next-selector { content: ':host(.cross-fade-all) > [animate]:not(.core-selected) [hero-p]'; }
|
| - :host(.cross-fade-all) ::content > [animate]:not(.core-selected) /deep/ [hero-p] {
|
| - background-color: rgba(0, 0, 0, 0);
|
| - }
|
| -</core-style>
|
| -
|
| -<!--
|
| -
|
| -`cross-fade` fades out elements in the outgoing page and fades in elements in the
|
| -incoming page during a page transition. You can configure the duration of the
|
| -transition with the global variable `CoreStyle.g.transitions.xfadeDuration`.
|
| -
|
| -Example:
|
| -
|
| - <core-animated-pages transition="cross-fade">
|
| - <section>
|
| - <div id="div1" cross-fade></div>
|
| - </section>
|
| - <section>
|
| - <div id="div2" cross-fade bg>
|
| - <div id="div3" cross-fade></div>
|
| - <div id="div4"></div>
|
| - </div>
|
| - </section>
|
| - </core-animated-pages>
|
| -
|
| -In the above example, `#div1` and `#div3` has the `cross-fade` attribute. `#div1`
|
| -will fade out and `#div3` will fade in with opacity transitions when the page switches
|
| -from 0 to 1. Sometimes, you may want to only fade the background color of an element
|
| -but not its children, and you can use the `bg` attribute along with the `#div1`
|
| -attribute as in `#div2`.
|
| -
|
| -@class cross-fade
|
| -@extends core-transition-pages
|
| -@status beta
|
| -@homepage github.io
|
| -
|
| --->
|
| -
|
| -<!--
|
| -
|
| -`cross-fade-delayed` performs a cross-fade after some delay, either specified in
|
| -the global variable `CoreStyle.g.transitions.xfadeDelay` or the duration of the
|
| -transition.
|
| -
|
| -Example:
|
| -
|
| - <core-animated-pages transition="hero-transition cross-fade-delayed">
|
| - <section>
|
| - <div id="div1" hero-id hero></div>
|
| - </section>
|
| - <section>
|
| - <div id="div2" hero-id hero>
|
| - <div id="div3" cross-fade-delayed></div>
|
| - </div>
|
| - </section>
|
| - </core-animated-pages>
|
| -
|
| -In the above example, `#div3` fades in after the hero transition from `#div1` to
|
| -`#div2` completes.
|
| -
|
| -@class cross-fade-delayed
|
| -@extends core-transition-pages
|
| -@status beta
|
| -@homepage github.io
|
| -
|
| --->
|
| -
|
| -<core-transition-pages id="cross-fade"></core-transition-pages>
|
| -<core-transition-pages id="cross-fade-delayed"></core-transition-pages>
|
| -<core-transition-pages id="cross-fade-all" scopeClass="cross-fade-all"></core-transition-pages>
|
|
|