Image Gallery - Copy this React, Tailwind Component to your project
Create a horizontal image gallery featuring 10 15 square shaped images that flow slowly across the screen. Only 4 5 images should be displayed at a time, with the ability to scroll left or right using buttons positioned at the top of the images. When hovering over an image, a smaller square shaped, greenish transparent overlay should appear in the center, displaying an animated text description about the image. In the top right corner of this overlay, there should be an "Add" button. When the "Add" button is clicked, the hovered image should smoothly zoom in and center on the screen, with the background darkening slightly to create a focus effect. Include the following animations throughout: Smooth scrolling of images from right to left. A subtle scaling effect on the images as they enter and exit the viewport. A fade in effect for the green overlay and text on hover. A zoom in and darkening background effect when the "Add" button is clicked. Ensure the overall design is visually appealing, with a modern aesthetic and responsive layout.
