artistry
Version:
A powerful and configurable stylesheet
15 lines (14 loc) • 531 B
text/stylus
.ripple {
--ripple-x: 10px;
--ripple-y: 10px;
transition: background-size 0.8s;
background-image: none;
background-image: radial-gradient(circle at var(--ripple-x) var(--ripple-y), transparent 1%, rgba(255, 255, 255, 0.5) 1%, rgba(255, 255, 255, 0.5) 20%, transparent 20%);
background-repeat: no-repeat;
background-size: 15000%;
//background-position: center;
&:active {
background-size: 100%;
transition: opacity 0.3s, box-shadow 0.3s, background-size 0s;
}
}