Update src/app/contact-us/page.tsx

Merge version_4 into main

src/app/contact-us/page.tsx

@@ -0,0 +1,84 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
+import FooterSimple from '@/components/sections/footer/FooterSimple';
+import { Mail, Instagram } from 'lucide-react';
+
+export default function ContactUsPage() {
+  return (
+    <ThemeProvider
+      defaultButtonVariant="icon-arrow"
+      defaultTextAnimation="background-highlight"
+      borderRadius="pill"
+      contentWidth="smallMedium"
+      sizing="mediumLargeSizeLargeTitles"
+      background="grid"
+      cardStyle="inset"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="solid"
+      headingFontWeight="light"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleCentered
+          brandName="Misael's Photography"
+          navItems={[
+            { name: "Portfolio", id: "portfolio" },
+            { name: "About", id: "about" },
+            { name: "Book Now", id: "booking" },
+            { name: "Contact", id: "contact-us" }
+          ]}
+          button={{
+            text: "Follow on Instagram",            href: "https://instagram.com/misaelsphotography"
+          }}
+        />
+      </div>
+
+      <div id="contact" data-section="contact">
+        <ContactCenter
+          tag="Get In Touch"
+          title="Contact Me"
+          description="Reach out through Instagram or email to discuss your photography session and let's create something beautiful together."
+          tagIcon={Mail}
+          tagAnimation="slide-up"
+          background={{ variant: "plain" }}
+          useInvertedBackground={false}
+          inputPlaceholder="Enter your email"
+          buttonText="Send Message"
+          termsText="By reaching out, you're agreeing to discuss your photography needs with me."
+          ariaLabel="Contact section with Instagram and email information"
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterSimple
+          columns={[
+            {
+              title: "Contact Information",              items: [
+                { label: "Email: walkingforward01@gmail.com", href: "mailto:walkingforward01@gmail.com" },
+                { label: "Instagram: @misaelsphotography", href: "https://instagram.com/misaelsphotography" }
+              ]
+            },
+            {
+              title: "Quick Links",              items: [
+                { label: "Portfolio", href: "/" },
+                { label: "About", href: "/" },
+                { label: "Book Now", href: "/" }
+              ]
+            },
+            {
+              title: "Follow Me",              items: [
+                { label: "Instagram", href: "https://instagram.com/misaelsphotography" },
+                { label: "Direct Message", href: "https://instagram.com/misaelsphotography" }
+              ]
+            }
+          ]}
+          bottomLeftText="Misael's Photography © 2024. All rights reserved."
+          bottomRightText="Capturing moments, telling stories."
+          ariaLabel="Site footer with contact information"
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -2,7 +2,7 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
+import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
 import SplitAbout from '@/components/sections/about/SplitAbout';
 import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
 import ContactText from '@/components/sections/contact/ContactText';
@@ -30,7 +30,7 @@ export default function LandingPage() {
             { name: "Portfolio", id: "portfolio" },
             { name: "About", id: "about" },
             { name: "Book Now", id: "booking" },
-            { name: "Contact", id: "contact" }
+            { name: "Contact", id: "contact-us" }
           ]}
           button={{
             text: "Follow on Instagram",            href: "https://instagram.com/misaelsphotography"
@@ -39,42 +39,25 @@ export default function LandingPage() {
       </div>
 
       <div id="hero" data-section="hero">
-        <HeroBillboardTestimonial
+        <SocialProofOne
-          title="Capture the Moment"
+          title="Live Feed from Instagram"
-          description="Tell Your Story"
+          description="Follow my latest work and behind-the-scenes moments. Stay connected with my photography journey."
-          background={{ variant: "plain" }}
+          names={[
-          testimonials={[
+            "Behind-the-Scenes Access",            "Exclusive Previews",            "Photography Tips & Tutorials",            "Follower Community"
-            {
-              name: "Sarah Chen",              handle: "@clients_loved",              testimonial: "Misael captured the essence of my graduation day perfectly. Every shot tells a story.",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/happy-business-woman-white-shirt_23-2148095748.jpg",              imageAlt: "happy client portrait smiling professional headshot"
-            },
-            {
-              name: "Michael Torres",              handle: "@portrait_fan",              testimonial: "Professional, creative, and absolutely worth every moment. Highly recommended.",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-posing_23-2148563424.jpg",              imageAlt: "client portrait man professional headshot smiling"
-            },
-            {
-              name: "Emma Rodriguez",              handle: "@event_planner",              testimonial: "The attention to detail and artistic vision is unmatched. Simply incredible.",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/businesswoman-sitting-chair-office_1303-21028.jpg",              imageAlt: "client testimonial portrait woman professional smiling"
-            },
-            {
-              name: "David Kim",              handle: "@family_photos",              testimonial: "Best decision for our family portraits. Timeless and beautiful.",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/successful-senior-businessman-standing-window_1262-3120.jpg",              imageAlt: "client portrait man professional headshot satisfied"
-            }
           ]}
-          testimonialRotationInterval={5000}
+          textboxLayout="default"
           useInvertedBackground={false}
-          tag="Premium Photography"
+          tag="Instagram Live Feed"
           tagIcon={Sparkles}
           tagAnimation="slide-up"
           buttons={[
-            { text: "Book Your Session Now", href: "#booking" },
+            { text: "Follow on Instagram", href: "https://instagram.com/misaelsphotography" },
             { text: "View Portfolio", href: "#portfolio" }
           ]}
           buttonAnimation="slide-up"
-          imageSrc="http://img.b2bpic.net/free-photo/man-his-professional-photography-studio_23-2149033378.jpg"
+          speed={40}
-          imageAlt="professional portrait photographer cinematic lighting"
+          showCard={true}
-          mediaAnimation="blur-reveal"
+          ariaLabel="Instagram live feed section"
-          ariaLabel="Photography hero section with cinematic background"
         />
       </div>