Update src/app/shop/[id]/page.tsx

Merge version_2 into main

src/app/blog/page.tsx

@@ -55,6 +55,7 @@ export default function BlogPage() {
                             carouselMode="buttons"
                             animationType="slide-up"
                             tagAnimation="slide-up"
+                            imageClassName="hover:scale-x-[-1] transition-transform duration-300"
                         />
                     </div>
                 )}
@@ -92,4 +93,4 @@ export default function BlogPage() {
             </ReactLenis>
         </ThemeProvider>
     );
-}
+}

src/app/page.tsx

@@ -56,6 +56,7 @@ export default function LandingPage() {
           imageAlt="Cozy coffee shop interior with warm lighting"
           mediaAnimation="opacity"
           frameStyle="card"
+          imageClassName="hover:scale-x-[-1] transition-transform duration-300"
         />
       </div>
 
@@ -73,6 +74,7 @@ export default function LandingPage() {
           imageSrc="https://img.b2bpic.net/free-photo/woman-grinding-coffee-coffee-machine_1303-31284.jpg"
           imageAlt="Premium coffee beans in a burlap sack"
           useInvertedBackground={false}
+          mediaClassName="hover:scale-x-[-1] transition-transform duration-300"
         />
       </div>
 
@@ -101,6 +103,7 @@ export default function LandingPage() {
           textboxLayout="default"
           useInvertedBackground={false}
           tag="What Makes Us Special"
+          cardClassName="hover:scale-x-[-1] transition-transform duration-300"
         />
       </div>
 
@@ -123,6 +126,7 @@ export default function LandingPage() {
           animationType="slide-up"
           textboxLayout="default"
           useInvertedBackground={false}
+          imageClassName="hover:scale-x-[-1] transition-transform duration-300"
         />
       </div>
 
@@ -154,6 +158,7 @@ export default function LandingPage() {
           textboxLayout="default"
           useInvertedBackground={false}
           speed={40}
+          imageClassName="hover:scale-x-[-1] transition-transform duration-300"
         />
       </div>
 
@@ -209,6 +214,7 @@ export default function LandingPage() {
           mediaAnimation="opacity"
           mediaPosition="right"
           buttonText="Send Message"
+          mediaClassName="hover:scale-x-[-1] transition-transform duration-300"
         />
       </div>
 
@@ -244,4 +250,4 @@ export default function LandingPage() {
       </div>
     </ThemeProvider>
   );
-}
+}

src/app/shop/[id]/page.tsx

@@ -256,4 +256,4 @@ function ProductPageContent({ params }: ProductPageProps) {
             </ReactLenis>
         </ThemeProvider>
     );
-}
+}

src/app/shop/page.tsx

@@ -101,6 +101,7 @@ function ShopPageContent() {
                         searchPlaceholder="Search products..."
                         filters={filters}
                         emptyMessage="No products found"
+                        imageClassName="hover:scale-x-[-1] transition-transform duration-300"
                     />
                 </div>
                 <div id="footer" data-section="footer">
@@ -124,4 +125,4 @@ export default function ShopPage() {
             <ShopPageContent />
         </Suspense>
     );
-}
+}