codecheck

1
// core
2
.p-ripple {
3
    overflow: hidden;
4
    position: relative;
5
}
6

7
.p-ink {
8
    display: block;
9
    position: absolute;
10
    background: rgba(255, 255, 255, 0.5);
11
    border-radius: 100%;
12
    transform: scale(0);
13
    pointer-events: none;
14
}
15

16
.p-ink-active {
17
    animation: ripple 0.4s linear;
18
}
19

20
.p-ripple-disabled .p-ink {
21
    display: none;
22
}
23

24
@keyframes ripple {
25
    100% {
26
        opacity: 0;
27
        transform: scale(2.5);
28
    }
29
}