Update src/app/shop/page.tsx

Merge version_3 into main

src/app/layout.tsx

@@ -1410,4 +1410,4 @@ export default function RootLayout({
       </ServiceWrapper>
     </html>
   );
-}
+}

src/app/page.tsx

@@ -1,9 +1,9 @@
-"use client"
+"use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
-import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
+import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
+import SplitAbout from '@/components/sections/about/SplitAbout';
 import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
 import TeamCardFive from '@/components/sections/team/TeamCardFive';
@@ -11,7 +11,7 @@ import BlogCardOne from '@/components/sections/blog/BlogCardOne';
 import FaqSplitText from '@/components/sections/faq/FaqSplitText';
 import ContactText from '@/components/sections/contact/ContactText';
 import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
-import { Award, Camera, Heart, Sparkles, Star } from "lucide-react";
+import { Award, Camera, Heart, Sparkles, Star, CheckCircle } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -43,55 +43,67 @@ export default function LandingPage() {
       </div>
 
       <div id="hero" data-section="hero">
-        <HeroSplitDualMedia
+        <HeroBillboardRotatedCarousel
           title="Surgical Excellence Meets Aesthetic Artistry"
           description="Experience transformative beauty enhancement with our board-certified surgeons. Combining cutting-edge surgical techniques with refined aesthetic vision to deliver results that enhance your natural beauty."
           tag="Premium Beauty Surgery"
           tagIcon={Sparkles}
           tagAnimation="slide-up"
-          background={{ variant: "plain" }}
-          rating={5}
-          ratingText="Trusted by Refined Patients"
-          mediaItems={[
+          background={{ variant: "canvas-reveal" }}
+          carouselItems={[
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/senior-patient-signing-medical-decisions-form-sitting-hospital-bed-modern-private-clinic-doctor-with-clipboard-nurse-working-backgorund-healthcare-medical-medicinal-system-documents-contra_482257-4751.jpg",              imageAlt: "Professional surgical consultation"
+              id: "1",              imageSrc: "http://img.b2bpic.net/free-photo/senior-patient-signing-medical-decisions-form-sitting-hospital-bed-modern-private-clinic-doctor-with-clipboard-nurse-working-backgorund-healthcare-medical-medicinal-system-documents-contra_482257-4751.jpg",              imageAlt: "Professional surgical consultation"
             },
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/male-patient-receiving-massage-from-doctor_107420-65163.jpg",              imageAlt: "Modern aesthetic enhancement results"
+              id: "2",              imageSrc: "http://img.b2bpic.net/free-photo/male-patient-receiving-massage-from-doctor_107420-65163.jpg",              imageAlt: "Modern aesthetic enhancement results"
+            },
+            {
+              id: "3",              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-doctor-looking-patient_23-2149352169.jpg?_wi=1",              imageAlt: "Professional consultation room"
+            },
+            {
+              id: "4",              imageSrc: "http://img.b2bpic.net/free-photo/woman-standing-cosmetology-studio_1157-33855.jpg?_wi=1",              imageAlt: "Cosmetic enhancement facility"
+            },
+            {
+              id: "5",              imageSrc: "http://img.b2bpic.net/free-photo/woman-s-body-with-marker-traces-front-view_23-2149350066.jpg?_wi=1",              imageAlt: "Surgical planning consultation"
+            },
+            {
+              id: "6",              imageSrc: "http://img.b2bpic.net/free-photo/woman-marked-out-cosmetic-surgery_273609-14510.jpg?_wi=1",              imageAlt: "Advanced surgical techniques"
             }
           ]}
-          mediaAnimation="slide-up"
           buttons={[
             { text: "Schedule Consultation", href: "#contact" },
             { text: "View Procedures", href: "#procedures" }
           ]}
           buttonAnimation="slide-up"
+          autoPlay={true}
+          autoPlayInterval={4000}
         />
       </div>
 
       <div id="about" data-section="about">
-        <MediaSplitTabsAbout
+        <SplitAbout
           title="Why Choose Élite Aesthetics"
           description="Our commitment to excellence defines every aspect of your experience."
-          tabs={[
+          textboxLayout="default"
+          useInvertedBackground={false}
+          bulletPoints={[
             {
-              id: "expertise",              label: "Board-Certified Excellence",              description: "Our surgeons are fellowship-trained and hold certifications from the highest medical boards. With over 200 combined years of surgical experience, we deliver results with precision and artistry."
+              title: "Board-Certified Excellence",              description: "Our surgeons are fellowship-trained and hold certifications from the highest medical boards. With over 200 combined years of surgical experience, we deliver results with precision and artistry.",              icon: CheckCircle
             },
             {
-              id: "innovation",              label: "Advanced Technology",              description: "We invest in state-of-the-art surgical equipment and techniques, ensuring the safest and most effective procedures available. Our operating suites meet international standards."
+              title: "Advanced Technology",              description: "We invest in state-of-the-art surgical equipment and techniques, ensuring the safest and most effective procedures available. Our operating suites meet international standards.",              icon: CheckCircle
             },
             {
-              id: "personalized",              label: "Personalized Care",              description: "Every patient is unique. We create customized treatment plans that honor your goals and enhance your natural features, never imposing a one-size-fits-all approach."
+              title: "Personalized Care",              description: "Every patient is unique. We create customized treatment plans that honor your goals and enhance your natural features, never imposing a one-size-fits-all approach.",              icon: CheckCircle
             },
             {
-              id: "results",              label: "Proven Results",              description: "Our gallery of transformations speaks to our commitment to excellence. See how we've helped thousands achieve their aesthetic dreams with natural-looking, beautiful results."
+              title: "Proven Results",              description: "Our gallery of transformations speaks to our commitment to excellence. See how we've helped thousands achieve their aesthetic dreams with natural-looking, beautiful results.",              icon: CheckCircle
             }
           ]}
           imageSrc="http://img.b2bpic.net/free-photo/empty-hospital-reception-counter-hallway-waiting-room-seats-medical-examination-appointment-with-physician-registration-desk-with-waiting-area-help-patients-with-disease-diagnosis_482257-51632.jpg"
           imageAlt="State-of-the-art surgical facility"
-          imagePosition="right"
           mediaAnimation="slide-up"
-          useInvertedBackground={false}
+          imagePosition="right"
         />
       </div>
 
@@ -107,16 +119,16 @@ export default function LandingPage() {
           gridVariant="three-columns-all-equal-width"
           products={[
             {
-              id: "1",              name: "Rhinoplasty",              price: "Consultation Based",              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-doctor-looking-patient_23-2149352169.jpg",              imageAlt: "Rhinoplasty procedure"
+              id: "1",              name: "Rhinoplasty",              price: "Consultation Based",              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-doctor-looking-patient_23-2149352169.jpg?_wi=2",              imageAlt: "Rhinoplasty procedure"
             },
             {
-              id: "2",              name: "Facelift",              price: "Consultation Based",              imageSrc: "http://img.b2bpic.net/free-photo/woman-standing-cosmetology-studio_1157-33855.jpg",              imageAlt: "Facelift procedure"
+              id: "2",              name: "Facelift",              price: "Consultation Based",              imageSrc: "http://img.b2bpic.net/free-photo/woman-standing-cosmetology-studio_1157-33855.jpg?_wi=2",              imageAlt: "Facelift procedure"
             },
             {
-              id: "3",              name: "Liposuction",              price: "Consultation Based",              imageSrc: "http://img.b2bpic.net/free-photo/woman-s-body-with-marker-traces-front-view_23-2149350066.jpg",              imageAlt: "Liposuction procedure"
+              id: "3",              name: "Liposuction",              price: "Consultation Based",              imageSrc: "http://img.b2bpic.net/free-photo/woman-s-body-with-marker-traces-front-view_23-2149350066.jpg?_wi=2",              imageAlt: "Liposuction procedure"
             },
             {
-              id: "4",              name: "Breast Augmentation",              price: "Consultation Based",              imageSrc: "http://img.b2bpic.net/free-photo/woman-marked-out-cosmetic-surgery_273609-14510.jpg",              imageAlt: "Breast augmentation procedure"
+              id: "4",              name: "Breast Augmentation",              price: "Consultation Based",              imageSrc: "http://img.b2bpic.net/free-photo/woman-marked-out-cosmetic-surgery_273609-14510.jpg?_wi=2",              imageAlt: "Breast augmentation procedure"
             }
           ]}
           buttons={[

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

@@ -97,13 +97,11 @@ function ProductPageContent({ params }: ProductPageProps) {
                             { name: "Our Team", id: "team" },
                             { name: "Results", id: "testimonials" },
                             { name: "FAQ", id: "faq" },
-                            { name: "Contact", id: "contact" },
-                            { name: "Shop", id: "/shop" }
+                            { name: "Contact", id: "contact" }
                         ]}
                         brandName="Élite Aesthetics"
                         bottomLeftText="Medical Grade Excellence"
                         bottomRightText="hello@eliteaesthetics.com"
-                        button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                     />
                     </div>
                     <main className="min-h-screen flex items-center justify-center pt-20">
@@ -144,13 +142,11 @@ function ProductPageContent({ params }: ProductPageProps) {
                                 { name: "Our Team", id: "team" },
                                 { name: "Results", id: "testimonials" },
                                 { name: "FAQ", id: "faq" },
-                                { name: "Contact", id: "contact" },
-                                { name: "Shop", id: "/shop" }
+                                { name: "Contact", id: "contact" }
                             ]}
                             brandName="Élite Aesthetics"
                             bottomLeftText="Medical Grade Excellence"
                             bottomRightText="hello@eliteaesthetics.com"
-                            button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                         />
                     </div>
                     <main className="min-h-screen flex items-center justify-center pt-20">
@@ -198,13 +194,11 @@ function ProductPageContent({ params }: ProductPageProps) {
                         { name: "Our Team", id: "team" },
                         { name: "Results", id: "testimonials" },
                         { name: "FAQ", id: "faq" },
-                        { name: "Contact", id: "contact" },
-                        { name: "Shop", id: "/shop" }
+                        { name: "Contact", id: "contact" }
                     ]}
                     brandName="Élite Aesthetics"
                     bottomLeftText="Medical Grade Excellence"
                     bottomRightText="hello@eliteaesthetics.com"
-                    button={{ text: "Cart", onClick: () => setCartOpen(true) }}
                 />
                 </div>
                 <div id="productDetailCard" data-section="productDetailCard">

src/app/shop/page.tsx

@@ -40,8 +40,7 @@ function ShopPageContent() {
                             { name: "Our Team", id: "team" },
                             { name: "Results", id: "testimonials" },
                             { name: "FAQ", id: "faq" },
-                            { name: "Contact", id: "contact" },
-                            { name: "Shop", id: "/shop" }
+                            { name: "Contact", id: "contact" }
                         ]}
                         brandName="Élite Aesthetics"
                         bottomLeftText="Medical Grade Excellence"
@@ -85,8 +84,7 @@ function ShopPageContent() {
                         { name: "Our Team", id: "team" },
                         { name: "Results", id: "testimonials" },
                         { name: "FAQ", id: "faq" },
-                        { name: "Contact", id: "contact" },
-                        { name: "Shop", id: "/shop" }
+                        { name: "Contact", id: "contact" }
                     ]}
                     brandName="Élite Aesthetics"
                     bottomLeftText="Medical Grade Excellence"