<div className="other-img"><img className="imgripple" src={require('src/assets/images/other.png')} alt=""></img></div>
.other-img {
width: 80px;
height: 80px;
margin: auto;
position: relative;display: flex;
justify-content: center;
align-items: center;
&>img {
width: 80px;
// margin: 0 15px;
}
.other-img::before {
content: "";
position: absolute;
width: 100%;
height: 100%;
top: -9px;
left: -8px;
background-image: radial-gradient(circle, rgba(255, 220, 0, .5) 0%, rgba(175, 0, 229, .9) 80%);
border-radius: 50%;
animation: ripple 2s ease-out infinite;
}
@keyframes ripple {
0% {
transform: scale(1);
opacity: 1;
}
100% {
transform: scale(2);
opacity: 0;
}
}