1 | /**
|
2 | * Copyright 2015 Google Inc. All Rights Reserved.
|
3 | *
|
4 | * Licensed under the Apache License, Version 2.0 (the "License");
|
5 | * you may not use this file except in compliance with the License.
|
6 | * You may obtain a copy of the License at
|
7 | *
|
8 | * http://www.apache.org/licenses/LICENSE-2.0
|
9 | *
|
10 | * Unless required by applicable law or agreed to in writing, software
|
11 | * distributed under the License is distributed on an "AS IS" BASIS,
|
12 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
13 | * See the License for the specific language governing permissions and
|
14 | * limitations under the License.
|
15 | */
|
16 |
|
17 | @import "../variables";
|
18 |
|
19 | .mdl-ripple {
|
20 | background : $ripple-bg-color;
|
21 | border-radius : 50%;
|
22 | height : 50px;
|
23 | left : 0;
|
24 | opacity : 0;
|
25 | pointer-events : none;
|
26 | position : absolute;
|
27 | top : 0;
|
28 | transform : translate(-50%, -50%);
|
29 | width : 50px;
|
30 | overflow : hidden;
|
31 |
|
32 | &.is-animating {
|
33 | transition: transform 0.3s $animation-curve-linear-out-slow-in,
|
34 | width 0.3s $animation-curve-linear-out-slow-in,
|
35 | height 0.3s $animation-curve-linear-out-slow-in,
|
36 | opacity 0.6s $animation-curve-linear-out-slow-in;
|
37 | }
|
38 |
|
39 | &.is-visible {
|
40 | opacity: 0.3;
|
41 | }
|
42 | }
|