| Index: third_party/polymer/v1_0/components-chromium/paper-ripple/paper-ripple.html
|
| diff --git a/third_party/polymer/v1_0/components-chromium/paper-ripple/paper-ripple.html b/third_party/polymer/v1_0/components-chromium/paper-ripple/paper-ripple.html
|
| deleted file mode 100644
|
| index 37a4400162f473255eb312b57019d0be1b67a9e4..0000000000000000000000000000000000000000
|
| --- a/third_party/polymer/v1_0/components-chromium/paper-ripple/paper-ripple.html
|
| +++ /dev/null
|
| @@ -1,148 +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
|
| ---><html><head><link rel="import" href="../polymer/polymer.html">
|
| -<link rel="import" href="../iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
|
| -
|
| -<!--
|
| -`paper-ripple` provides a visual effect that other paper elements can
|
| -use to simulate a rippling effect emanating from the point of contact. The
|
| -effect can be visualized as a concentric circle with motion.
|
| -
|
| -Example:
|
| -
|
| - <paper-ripple></paper-ripple>
|
| -
|
| -`paper-ripple` listens to "mousedown" and "mouseup" events so it would display ripple
|
| -effect when touches on it. You can also defeat the default behavior and
|
| -manually route the down and up actions to the ripple element. Note that it is
|
| -important if you call downAction() you will have to make sure to call
|
| -upAction() so that `paper-ripple` would end the animation loop.
|
| -
|
| -Example:
|
| -
|
| - <paper-ripple id="ripple" style="pointer-events: none;"></paper-ripple>
|
| - ...
|
| - downAction: function(e) {
|
| - this.$.ripple.downAction({x: e.x, y: e.y});
|
| - },
|
| - upAction: function(e) {
|
| - this.$.ripple.upAction();
|
| - }
|
| -
|
| -Styling ripple effect:
|
| -
|
| - Use CSS color property to style the ripple:
|
| -
|
| - paper-ripple {
|
| - color: #4285f4;
|
| - }
|
| -
|
| - Note that CSS color property is inherited so it is not required to set it on
|
| - the `paper-ripple` element directly.
|
| -
|
| -By default, the ripple is centered on the point of contact. Apply the `recenters`
|
| -attribute to have the ripple grow toward the center of its container.
|
| -
|
| - <paper-ripple recenters></paper-ripple>
|
| -
|
| -You can also center the ripple inside its container from the start.
|
| -
|
| - <paper-ripple center></paper-ripple>
|
| -
|
| -Apply `circle` class to make the rippling effect within a circle.
|
| -
|
| - <paper-ripple class="circle"></paper-ripple>
|
| -
|
| -@group Paper Elements
|
| -@element paper-ripple
|
| -@hero hero.svg
|
| -@demo demo/index.html
|
| --->
|
| -
|
| -</head><body><dom-module id="paper-ripple">
|
| -
|
| - <!--
|
| - Fired when the animation finishes. This is useful if you want to wait until the ripple
|
| - animation finishes to perform some action.
|
| -
|
| - @event transitionend
|
| - @param {Object} detail
|
| - @param {Object} detail.node The animated node
|
| - -->
|
| -
|
| - <style>
|
| - :host {
|
| - display: block;
|
| - position: absolute;
|
| - border-radius: inherit;
|
| - overflow: hidden;
|
| - top: 0;
|
| - left: 0;
|
| - right: 0;
|
| - bottom: 0;
|
| - }
|
| -
|
| - :host([animating]) {
|
| - /* This resolves a rendering issue in Chrome (as of 40) where the
|
| - ripple is not properly clipped by its parent (which may have
|
| - rounded corners). See: http://jsbin.com/temexa/4
|
| -
|
| - Note: We only apply this style conditionally. Otherwise, the browser
|
| - will create a new compositing layer for every ripple element on the
|
| - page, and that would be bad. */
|
| - -webkit-transform: translate(0, 0);
|
| - transform: translate3d(0, 0, 0);
|
| - }
|
| -
|
| - :host([noink]) {
|
| - pointer-events: none;
|
| - }
|
| -
|
| - #background,
|
| - #waves,
|
| - .wave-container,
|
| - .wave {
|
| - pointer-events: none;
|
| - position: absolute;
|
| - top: 0;
|
| - left: 0;
|
| - width: 100%;
|
| - height: 100%;
|
| - }
|
| -
|
| - #background,
|
| - .wave {
|
| - opacity: 0;
|
| - }
|
| -
|
| - #waves,
|
| - .wave {
|
| - overflow: hidden;
|
| - }
|
| -
|
| - .wave-container,
|
| - .wave {
|
| - border-radius: 50%;
|
| - }
|
| -
|
| - :host(.circle) #background,
|
| - :host(.circle) #waves {
|
| - border-radius: 50%;
|
| - }
|
| -
|
| - :host(.circle) .wave-container {
|
| - overflow: hidden;
|
| - }
|
| -
|
| - </style>
|
| - <template>
|
| - <div id="background"></div>
|
| - <div id="waves"></div>
|
| - </template>
|
| -</dom-module>
|
| -<script src="paper-ripple-extracted.js"></script></body></html>
|
|
|
Chromium Code Reviews
Issue 1162963002:
Revert "Rename polymer and cr_elements v0_8 to v1_0" (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master