Update src/app/templates/page.tsx

Merge version_3 into main

src/app/ai-image-generator/page.tsx

@@ -0,0 +1,92 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import { Wand2 } from "lucide-react";
+
+export default function AiImageGeneratorPage() {
+  const navItems = [
+    {
+      name: "Home",      id: "/"
+    },
+    {
+      name: "About",      id: "/#about"
+    },
+    {
+      name: "Features",      id: "/#features"
+    },
+    {
+      name: "Products",      id: "/#products"
+    },
+    {
+      name: "Pricing",      id: "/#pricing"
+    },
+    {
+      name: "Testimonials",      id: "/#testimonials"
+    },
+    {
+      name: "FAQ",      id: "/#faq"
+    },
+    {
+      name: "Contact",      id: "/#contact"
+    },
+    {
+      name: "AI Image Generator",      id: "/ai-image-generator"
+    }
+  ];
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="shift-hover"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="pill"
+      contentWidth="smallMedium"
+      sizing="mediumLarge"
+      background="noise"
+      cardStyle="solid"
+      primaryButtonStyle="flat"
+      secondaryButtonStyle="solid"
+      headingFontWeight="normal"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={navItems}
+            button={{ text: "Browse Templates", href: "/#products" }}
+            logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ruakxa"
+            brandName="BuildDigital"
+          />
+        </div>
+
+        <div id="ai-tool" data-section="ai-tool" className="py-20 text-center">
+          <div className="container max-w-2xl mx-auto px-4">
+            <h1 className="text-5xl font-bold mb-6 flex items-center justify-center gap-4">
+              <Wand2 size={48} className="text-primary-cta" />
+              AI Image Generator
+            </h1>
+            <p className="text-xl text-foreground/70 mb-8">
+              Unleash your creativity with our cutting-edge AI image generation tool. Describe your vision, and let AI bring it to life in stunning visuals.
+            </p>
+            <div className="bg-card p-8 rounded-lg shadow-lg">
+              <p className="text-foreground/80 mb-4">
+                (Placeholder for AI Image Generation Interface)
+              </p>
+              <textarea
+                className="w-full p-3 mb-4 rounded-md bg-background-accent text-foreground border border-card-border focus:ring-2 focus:ring-primary-cta outline-none transition-all"
+                rows={4}
+                placeholder="Enter your prompt here, e.g., 'a futuristic city at sunset, cyberpunk style, highly detailed, 8k'"
+              ></textarea>
+              <button className="bg-primary-cta text-white px-6 py-3 rounded-md font-semibold hover:bg-primary-cta/90 transition-colors">
+                Generate Image
+              </button>
+            </div>
+            <p className="mt-8 text-sm text-foreground/50">
+              Please note: This is a placeholder. Full functionality coming soon!
+            </p>
+          </div>
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/login/page.tsx

@@ -0,0 +1,99 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+
+export default function LoginPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="shift-hover"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="pill"
+        contentWidth="smallMedium"
+        sizing="mediumLarge"
+        background="noise"
+        cardStyle="solid"
+        primaryButtonStyle="flat"
+        secondaryButtonStyle="solid"
+        headingFontWeight="normal"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={[
+              {
+                name: "Home", id: "#home"
+              },
+              {
+                name: "About", id: "#about"
+              },
+              {
+                name: "Features", id: "#features"
+              },
+              {
+                name: "Templates", id: "/templates"
+              },
+              {
+                name: "Pricing", id: "#pricing"
+              },
+              {
+                name: "Testimonials", id: "#testimonials"
+              },
+              {
+                name: "FAQ", id: "#faq"
+              },
+              {
+                name: "Contact", id: "#contact"
+              },
+              {
+                name: "Login", id: "/login"
+              }
+            ]}
+            button={{
+              text: "Browse Templates", href: "/templates"
+            }}
+            logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ruakxa"
+            brandName="BuildDigital"
+          />
+        </div>
+
+        <div id="login" data-section="login">
+          <ContactSplitForm
+            title="Log in to Your Account"
+            description="Access your personalized dashboard and template library."
+            inputs={[
+              {
+                name: "email", type: "email", placeholder: "Email address", required: true
+              },
+              {
+                name: "password", type: "password", placeholder: "Password", required: true
+              }
+            ]}
+            buttonText="Login"
+            mediaPosition="left"
+            imageSrc="http://img.b2bpic.net/free-photo/view-young-entrepreneur-doing-paperwork-at-desk-computer_1098-19600.jpg"
+            imageAlt="Person logging into a digital platform"
+            useInvertedBackground={true}
+            onSubmit={(data) => console.log("Login data:", data)}
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterLogoReveal
+            logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ruakxa"
+            logoText="BuildDigital"
+            leftLink={{
+              text: "Privacy Policy", href: "#"
+            }}
+            rightLink={{
+              text: "Terms of Service", href: "#"
+            }}
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -34,7 +34,7 @@ export default function LandingPage() {
       <NavbarStyleCentered
       navItems={[
         {
-          name: "Home",          id: "#home"},
+          name: "Home",          id: "/"},
         {
           name: "About",          id: "#about"},
         {
@@ -49,9 +49,11 @@ export default function LandingPage() {
           name: "FAQ",          id: "#faq"},
         {
           name: "Contact",          id: "#contact"},
+        {
+          name: "AI Image Generator", id: "/ai-image-generator"}
       ]}
       button={{
-        text: "Browse Templates",        href: "#products"}}
+        text: "Browse Templates",          href: "/#products"}}
       logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ruakxa"
       brandName="BuildDigital"
     />
@@ -75,7 +77,7 @@ export default function LandingPage() {
       enableKpiAnimation={true}
       buttons={[
         {
-          text: "Browse Templates",          href: "#products"},
+          text: "Browse Templates",          href: "/#products"},
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/woman-home-using-ai-software-turning-text-prompt-into-photos-drinking-coffee_482257-125868.jpg"
       imageAlt="Showcase of various digital product templates"
@@ -86,8 +88,7 @@ export default function LandingPage() {
         {
           src: "http://img.b2bpic.net/free-photo/portrait-middle-aged-businesswoman_23-2148204386.jpg",          alt: "Portrait of middle aged businesswoman"},
         {
-          src: "http://img.b2bpic.net/free-photo/portrait-smiling-blonde-businesswoman-formal-dressed-isolated-dark-textured-background_613910-5399.jpg",          alt: "Portrait of a smiling blonde businesswoman formal dressed."},
+          src: "http://img.b2bpic.net/free-photo/portrait-smiling-blonde-businesswoman-formal-dressed-isolated-dark-textured-background_613910-5399.jpg",          alt: "Portrait of a smiling blonde businesswoman formal dressed."},            {
-        {
           src: "http://img.b2bpic.net/free-photo/confident-young-businesswoman-with-folded-arms_1262-1775.jpg",          alt: "Confident Young Businesswoman with Folded Arms"},
         {
           src: "http://img.b2bpic.net/free-photo/closeup-shot-handsome-male-smiling_181624-41237.jpg",          alt: "Closeup shot of a handsome male smiling"},
@@ -122,7 +123,7 @@ export default function LandingPage() {
       ]}
       buttons={[
         {
-          text: "Learn More",          href: "#features"}
+          text: "Learn More",          href: "/#features"}
       ]}
     />
   </div>
@@ -175,22 +176,22 @@ export default function LandingPage() {
       products={[
         {
           id: "p1",          brand: "Canva",          name: "Social Media Starter Kit",          price: "$29.00",          rating: 5,
-          reviewCount: "120 reviews",          imageSrc: "http://img.b2bpic.net/free-psd/flat-design-business-strategy-instagram-stories_23-2150683758.jpg",          imageAlt: "Canva Social Media Starter Kit"},
+          reviewCount: "120 reviews",          imageSrc: "http://img.b2bpic.net/free-psd/flat-design-business-strategy-instagram-stories_23-2150683758.jpg?_wi=1",          imageAlt: "Canva Social Media Starter Kit"},
         {
           id: "p2",          brand: "CapCut",          name: "Dynamic Video Intro Pack",          price: "$39.00",          rating: 4.8,
-          reviewCount: "85 reviews",          imageSrc: "http://img.b2bpic.net/free-photo/cinema-still-life_23-2148017206.jpg",          imageAlt: "CapCut Dynamic Video Intro Pack"},
+          reviewCount: "85 reviews",          imageSrc: "http://img.b2bpic.net/free-photo/cinema-still-life_23-2148017206.jpg?_wi=1",          imageAlt: "CapCut Dynamic Video Intro Pack"},
         {
           id: "p3",          brand: "Notion",          name: "Ultimate Productivity Hub",          price: "$49.00",          rating: 4.9,
-          reviewCount: "150 reviews",          imageSrc: "http://img.b2bpic.net/free-photo/glasses-calculator-coins-tablet-white-neat-desk_1387-289.jpg",          imageAlt: "Notion Ultimate Productivity Hub"},
+          reviewCount: "150 reviews",          imageSrc: "http://img.b2bpic.net/free-photo/glasses-calculator-coins-tablet-white-neat-desk_1387-289.jpg?_wi=1",          imageAlt: "Notion Ultimate Productivity Hub"},
         {
           id: "p4",          brand: "WordPress",          name: "Elegant Portfolio Theme",          price: "$79.00",          rating: 4.7,
-          reviewCount: "70 reviews",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-desk-concept-with-copy-space_23-2148459730.jpg",          imageAlt: "WordPress Elegant Portfolio Theme"},
+          reviewCount: "70 reviews",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-desk-concept-with-copy-space_23-2148459730.jpg?_wi=1",          imageAlt: "WordPress Elegant Portfolio Theme"},
         {
           id: "p5",          brand: "Alight Motion",          name: "Animated Infographics Pack",          price: "$34.00",          rating: 4.6,
-          reviewCount: "60 reviews",          imageSrc: "http://img.b2bpic.net/free-vector/colorful-infographics-timeline-flat-design_52683-16867.jpg",          imageAlt: "Alight Motion Animated Infographics Pack"},
+          reviewCount: "60 reviews",          imageSrc: "http://img.b2bpic.net/free-vector/colorful-infographics-timeline-flat-design_52683-16867.jpg?_wi=1",          imageAlt: "Alight Motion Animated Infographics Pack"},
         {
           id: "p6",          brand: "Figma",          name: "Modern Mobile UI Kit",          price: "$59.00",          rating: 4.9,
-          reviewCount: "95 reviews",          imageSrc: "http://img.b2bpic.net/free-vector/workout-tracker-application_23-2148676935.jpg",          imageAlt: "Figma Modern Mobile UI Kit"}
+          reviewCount: "95 reviews",          imageSrc: "http://img.b2bpic.net/free-vector/workout-tracker-application_23-2148676935.jpg?_wi=1",          imageAlt: "Figma Modern Mobile UI Kit"}
       ]}
       title="Popular Templates"
       description="Explore our best-selling digital products, from trending social media kits to powerful web development themes."

src/app/templates/page.tsx

@@ -0,0 +1,103 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import ProductCardThree from '@/components/sections/product/ProductCardThree';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+
+export default function TemplatesPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="shift-hover"
+        defaultTextAnimation="entrance-slide"
+        borderRadius="pill"
+        contentWidth="smallMedium"
+        sizing="mediumLarge"
+        background="noise"
+        cardStyle="solid"
+        primaryButtonStyle="flat"
+        secondaryButtonStyle="solid"
+        headingFontWeight="normal"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={[
+              {
+                name: "Home", id: "#home"
+              },
+              {
+                name: "About", id: "#about"
+              },
+              {
+                name: "Features", id: "#features"
+              },
+              {
+                name: "Templates", id: "/templates"
+              },
+              {
+                name: "Pricing", id: "#pricing"
+              },
+              {
+                name: "Testimonials", id: "#testimonials"
+              },
+              {
+                name: "FAQ", id: "#faq"
+              },
+              {
+                name: "Contact", id: "#contact"
+              },
+              {
+                name: "Login", id: "/login"
+              }
+            ]}
+            button={{
+              text: "Browse Templates", href: "/templates"
+            }}
+            logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ruakxa"
+            brandName="BuildDigital"
+          />
+        </div>
+
+        <div id="templates" data-section="templates">
+          <ProductCardThree
+            animationType="slide-up"
+            textboxLayout="default"
+            gridVariant="three-columns-all-equal-width"
+            useInvertedBackground={false}
+            products={[
+              {
+                id: "t1",                name: "Pro Social Media Kit",                price: "$35.00",                imageSrc: "http://img.b2bpic.net/free-psd/flat-design-business-strategy-instagram-stories_23-2150683758.jpg?_wi=2",                imageAlt: "Canva Social Media Template"},
+              {
+                id: "t2",                name: "YouTube Intro Pack",                price: "$45.00",                imageSrc: "http://img.b2bpic.net/free-photo/cinema-still-life_23-2148017206.jpg?_wi=2",                imageAlt: "CapCut Video Intro Template"},
+              {
+                id: "t3",                name: "Advanced Notion Planner",                price: "$55.00",                imageSrc: "http://img.b2bpic.net/free-photo/glasses-calculator-coins-tablet-white-neat-desk_1387-289.jpg?_wi=2",                imageAlt: "Notion Productivity Template"},
+              {
+                id: "t4",                name: "Modern Portfolio WordPress Theme",                price: "$89.00",                imageSrc: "http://img.b2bpic.net/free-photo/front-view-desk-concept-with-copy-space_23-2148459730.jpg?_wi=2",                imageAlt: "WordPress Website Template"},
+              {
+                id: "t5",                name: "Infographic Video Template",                price: "$40.00",                imageSrc: "http://img.b2bpic.net/free-vector/colorful-infographics-timeline-flat-design_52683-16867.jpg?_wi=2",                imageAlt: "Alight Motion Infographic Template"},
+              {
+                id: "t6",                name: "SaaS Dashboard UI Kit",                price: "$65.00",                imageSrc: "http://img.b2bpic.net/free-vector/workout-tracker-application_23-2148676935.jpg?_wi=2",                imageAlt: "Figma UI Kit Template"}
+            ]}
+            title="Our Premium Templates"
+            description="Discover a wide array of professionally designed templates for all your creative and business needs."
+          />
+        </div>
+
+        <div id="footer" data-section="footer">
+          <FooterLogoReveal
+            logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ruakxa"
+            logoText="BuildDigital"
+            leftLink={{
+              text: "Privacy Policy", href: "#"
+            }}
+            rightLink={{
+              text: "Terms of Service", href: "#"
+            }}
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}