Add active scale effect to animate-img

[MohamadSalman11]

Description

Previously, there was only a hover effect that scaled the images up slightly. I added a new effect using the :active pseudo-class, which scales the images back down when clicked.

Motivation & Context

The active effect clearly shows the image changing, making it more user-friendly and enjoyable to click.

Type of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Refactoring (non-breaking change)
• Breaking change (fix or feature that would change existing functionality)

Checklist

• I have read the contributing guidelines
• My code follows the code style of the project (using npm run lint)
• My change introduces changes to the documentation
• I have updated the documentation accordingly
• I have added tests to cover my changes
• All new and existing tests passed

Live previews

• https://deploy-preview-40878--twbs-bootstrap.netlify.app/ (scroll to the Webpack, Parcel, and Vite icons)

Related issues