export default function enableRippleEffect(container) {
    container
        .querySelectorAll('.hover-ripple-animate')
        .forEach(link => {
            link.addEventListener('mouseenter', e => {
                const rect = link.getBoundingClientRect();
                const ripple = document.createElement('span');
                ripple.classList.add('ripple-effect');

                const size = Math.max(rect.width, rect.height);
                ripple.style.width = ripple.style.height = `${size}px`;
                ripple.style.left = `${e.clientX - rect.left}px`;
                ripple.style.top = `${e.clientY - rect.top}px`;

                link.appendChild(ripple);
                ripple.addEventListener('animationend', () => ripple.remove());
            });
        });
}