t-fighting-design/theme/ripple.css

Fighting design can quickly build interactive interfaces in vue3 applications, which looks good.

.f-ripple{cursor:pointer;overflow:hidden;position:relative}.f-ripple.f-ripple__select{user-select:none}.f-ripple .f-ripple__animation{width:0px;height:100%;position:absolute;transform:translate(-50%,-100%);pointer-events:none;border-radius:10%;animation:f-ripples-animation .4s linear;opacity:var(--f-ripple-start-opacity, .5);background:#fff}@keyframes f-ripples-animation{0%{width:0px;opacity:var(--f-ripple-start-opacity, .5)}to{width:1500px;opacity:var(--f-ripple-end-opacity, 0);border-radius:0}}