Update src/app/order-confirmation/page.tsx

Merge version_1 into main

src/app/cart/page.tsx

@@ -0,0 +1,41 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import { useState } from "react";
+import ProductCart from '@/components/ecommerce/cart/ProductCart';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+
+export default function CartPage() {
+  const [items, setItems] = useState([
+    { id: "p1", name: "Urban Minimalist", price: "$89", quantity: 1, imageSrc: "http://img.b2bpic.net/free-photo/excited-female-tourist-admiring-view-from-balcony_1262-18831.jpg" }
+  ]);
+
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <NavbarStyleApple 
+        navItems={[{ name: "Home", id: "/" }, { name: "Cart", id: "/cart" }]} 
+        brandName="UniPack"
+      />
+      <div className="pt-32 pb-20 px-6 container mx-auto">
+        <ProductCart 
+            isOpen={true}
+            onClose={() => {}}
+            items={items}
+            total="$89"
+            buttons={[{ text: "Checkout", href: "/checkout" }]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/checkout/page.tsx

@@ -0,0 +1,39 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+
+export default function CheckoutPage() {
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <NavbarStyleApple 
+        navItems={[{ name: "Home", id: "/" }, { name: "Cart", id: "/cart" }]} 
+        brandName="UniPack"
+      />
+      <div className="pt-32 pb-20 px-6 container mx-auto max-w-2xl">
+        <h1 className="text-4xl font-bold mb-8">Checkout</h1>
+        <div className="bg-card p-8 rounded-xl shadow-lg border">
+            <h2 className="text-2xl font-semibold mb-4">Order Summary</h2>
+            <div className="space-y-4 mb-8">
+                <div className="flex justify-between"><span>Urban Minimalist</span><span>$89</span></div>
+                <div className="border-t pt-4 font-bold flex justify-between"><span>Total</span><span>$89</span></div>
+            </div>
+            <button onClick={() => window.location.href = '/order-confirmation'} className="w-full bg-primary-cta text-white py-3 rounded-lg">
+                Place Order
+            </button>
+        </div>
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/login/page.tsx

@@ -0,0 +1,35 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import ContactForm from '@/components/form/ContactForm';
+
+export default function LoginPage() {
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <NavbarStyleApple 
+        navItems={[{ name: "Home", id: "/" }, { name: "Login", id: "/login" }]} 
+        brandName="UniPack" 
+      />
+      <div className="flex min-h-screen items-center justify-center p-8">
+        <ContactForm 
+          title="Sign In"
+          description="Enter your credentials to access your account."
+          tag="Account Access"
+          useInvertedBackground={false}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/order-confirmation/page.tsx

@@ -0,0 +1,33 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+
+export default function OrderConfirmationPage() {
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <NavbarStyleApple 
+        navItems={[{ name: "Home", id: "/" }]} 
+        brandName="UniPack"
+      />
+      <div className="pt-32 pb-20 px-6 container mx-auto text-center">
+        <h1 className="text-5xl font-bold mb-6">Thank You!</h1>
+        <p className="text-xl mb-8">Your order has been placed successfully.</p>
+        <a href="/" className="inline-block bg-primary-cta text-white px-8 py-3 rounded-full font-bold">
+            Back to Home
+        </a>
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -29,21 +29,13 @@ export default function LandingPage() {
       <NavbarStyleApple
       navItems={[
         {
-          name: "Home",
+          name: "Home",          id: "hero"},
-          id: "hero",
-        },
         {
-          name: "Collections",
+          name: "Collections",          id: "products"},
-          id: "products",
-        },
         {
-          name: "Reviews",
+          name: "Reviews",          id: "testimonials"},
-          id: "testimonials",
-        },
         {
-          name: "Contact",
+          name: "Login",          id: "/login"},
-          id: "contact",
-        },
       ]}
       brandName="UniPack"
     />
@@ -52,60 +44,32 @@ export default function LandingPage() {
   <div id="hero" data-section="hero">
       <HeroCentered
       background={{
-        variant: "plain",
+        variant: "plain"}}
-      }}
       title="Carry Your Ambition"
       description="Premium backpacks designed for the modern student. Durability meets clean design for your academic journey."
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/amazed-woman-walking-forest_23-2147835342.jpg",
+          src: "http://img.b2bpic.net/free-photo/amazed-woman-walking-forest_23-2147835342.jpg",          alt: "Sarah"},
-          alt: "Sarah",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/young-girl-student-with-book-her-hands-goes-university_169016-66662.jpg",
+          src: "http://img.b2bpic.net/free-photo/young-girl-student-with-book-her-hands-goes-university_169016-66662.jpg",          alt: "Mark"},
-          alt: "Mark",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/young-pretty-girl-trench-coat-sunglasses-with-backpack-shoulder-holding-notepads-hand-thoughtfully-looking-camera-while-spending-time-beige-background_574295-309.jpg",
+          src: "http://img.b2bpic.net/free-photo/young-pretty-girl-trench-coat-sunglasses-with-backpack-shoulder-holding-notepads-hand-thoughtfully-looking-camera-while-spending-time-beige-background_574295-309.jpg",          alt: "Emily"},
-          alt: "Emily",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/cute-helpful-friendlylooking-joyful-european-redhead-woman-show-thumb-left-smiling-delighted_1258-228840.jpg",
+          src: "http://img.b2bpic.net/free-photo/cute-helpful-friendlylooking-joyful-european-redhead-woman-show-thumb-left-smiling-delighted_1258-228840.jpg",          alt: "James"},
-          alt: "James",
-        },
         {
-          src: "http://img.b2bpic.net/free-photo/cheerful-young-queer-girl-glasses-denim-jacket-standing-near-rainbow-wall-cross-hands-chest-smiling-camera-happy-lifestyle-urban-life-generation-concept_197531-30548.jpg",
+          src: "http://img.b2bpic.net/free-photo/cheerful-young-queer-girl-glasses-denim-jacket-standing-near-rainbow-wall-cross-hands-chest-smiling-camera-happy-lifestyle-urban-life-generation-concept_197531-30548.jpg",          alt: "Chloe"},
-          alt: "Chloe",
-        },
       ]}
       avatarText="Join 5,000+ satisfied students"
       buttons={[
         {
-          text: "Shop Collections",
+          text: "Shop Collections",          href: "#products"},
-          href: "#products",
-        },
       ]}
       marqueeItems={[
-        {
+        { type: "text", text: "100% Water Resistant" },
-          type: "text",
+        { type: "text", text: "Ergonomic Design" },
-          text: "100% Water Resistant",
+        { type: "text", text: "Laptop Protection" },
-        },
+        { type: "text", text: "Sustainable Fabric" },
-        {
+        { type: "text", text: "Campus Ready" },
-          type: "text",
-          text: "Ergonomic Design",
-        },
-        {
-          type: "text",
-          text: "Laptop Protection",
-        },
-        {
-          type: "text",
-          text: "Sustainable Fabric",
-        },
-        {
-          type: "text",
-          text: "Campus Ready",
-        },
       ]}
     />
   </div>
@@ -116,21 +80,9 @@ export default function LandingPage() {
       title="Designed for Campus Life"
       description="We build bags that work as hard as you do, featuring tech-ready compartments and water-resistant materials."
       accordionItems={[
-        {
+        { id: "1", title: "Tech-Ready Compartment", content: "Dedicated padded sleeve for your 16-inch laptop." },
-          id: "1",
+        { id: "2", title: "Ergonomic Support", content: "Breathable back panels designed to keep you cool during campus walks." },
-          title: "Tech-Ready Compartment",
+        { id: "3", title: "Weather-Resistant", content: "Coated polyester fabric ensures your textbooks stay dry in any rain." },
-          content: "Dedicated padded sleeve for your 16-inch laptop.",
-        },
-        {
-          id: "2",
-          title: "Ergonomic Support",
-          content: "Breathable back panels designed to keep you cool during campus walks.",
-        },
-        {
-          id: "3",
-          title: "Weather-Resistant",
-          content: "Coated polyester fabric ensures your textbooks stay dry in any rain.",
-        },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/young-woman-with-backpack-park_23-2148208782.jpg"
       mediaAnimation="slide-up"
@@ -144,42 +96,9 @@ export default function LandingPage() {
       gridVariant="three-columns-all-equal-width"
       useInvertedBackground={true}
       products={[
-        {
+        { id: "p1", name: "Urban Minimalist", price: "$89", imageSrc: "http://img.b2bpic.net/free-photo/excited-female-tourist-admiring-view-from-balcony_1262-18831.jpg" },
-          id: "p1",
+        { id: "p2", name: "Classic Navy", price: "$79", imageSrc: "http://img.b2bpic.net/free-photo/blue-backpack-wooden-table_23-2148179040.jpg" },
-          name: "Urban Minimalist",
+        { id: "p3", name: "Professional Charcoal", price: "$95", imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-putting-book-backpack_23-2148181545.jpg" },
-          price: "$89",
-          imageSrc: "http://img.b2bpic.net/free-photo/excited-female-tourist-admiring-view-from-balcony_1262-18831.jpg",
-        },
-        {
-          id: "p2",
-          name: "Classic Navy",
-          price: "$79",
-          imageSrc: "http://img.b2bpic.net/free-photo/blue-backpack-wooden-table_23-2148179040.jpg",
-        },
-        {
-          id: "p3",
-          name: "Professional Charcoal",
-          price: "$95",
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-putting-book-backpack_23-2148181545.jpg",
-        },
-        {
-          id: "p4",
-          name: "Olive Utility",
-          price: "$85",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-girl-sitting-plastic-orange-penny-shortboard-asphalt-cap_158538-13629.jpg",
-        },
-        {
-          id: "p5",
-          name: "Tan Academic",
-          price: "$110",
-          imageSrc: "http://img.b2bpic.net/free-photo/smiling-flirting-woman-walking-city-street-stylish-printed-skirt-denim-oversize-jacket-wearing-pink-sunglasses_285396-315.jpg",
-        },
-        {
-          id: "p6",
-          name: "Burgundy Classic",
-          price: "$75",
-          imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-backpack-map_23-2148909625.jpg",
-        },
       ]}
       title="Our Signature Collections"
       description="Find the perfect balance of form and function for your college life."
@@ -192,41 +111,8 @@ export default function LandingPage() {
       textboxLayout="default"
       useInvertedBackground={false}
       testimonials={[
-        {
+        { id: "t1", name: "Sarah Miller", handle: "@sarah_m", testimonial: "Best bag I've ever owned. The laptop sleeve is so well protected!", imageSrc: "http://img.b2bpic.net/free-photo/amazed-woman-walking-forest_23-2147835342.jpg" },
-          id: "t1",
+        { id: "t2", name: "Mark D.", handle: "@mark_d", testimonial: "I love the minimalist aesthetic. It fits my professional look.", imageSrc: "http://img.b2bpic.net/free-photo/young-girl-student-with-book-her-hands-goes-university_169016-66662.jpg" },
-          name: "Sarah Miller",
-          handle: "@sarah_m",
-          testimonial: "Best bag I've ever owned. The laptop sleeve is so well protected!",
-          imageSrc: "http://img.b2bpic.net/free-photo/amazed-woman-walking-forest_23-2147835342.jpg",
-        },
-        {
-          id: "t2",
-          name: "Mark D.",
-          handle: "@mark_d",
-          testimonial: "I love the minimalist aesthetic. It fits my professional look.",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-girl-student-with-book-her-hands-goes-university_169016-66662.jpg",
-        },
-        {
-          id: "t3",
-          name: "Emily J.",
-          handle: "@emily_j",
-          testimonial: "Sturdy, comfortable, and looks great after a full semester of abuse.",
-          imageSrc: "http://img.b2bpic.net/free-photo/young-pretty-girl-trench-coat-sunglasses-with-backpack-shoulder-holding-notepads-hand-thoughtfully-looking-camera-while-spending-time-beige-background_574295-309.jpg",
-        },
-        {
-          id: "t4",
-          name: "James K.",
-          handle: "@james_k",
-          testimonial: "The weather resistance is the real deal. Saved my notes during a downpour.",
-          imageSrc: "http://img.b2bpic.net/free-photo/cute-helpful-friendlylooking-joyful-european-redhead-woman-show-thumb-left-smiling-delighted_1258-228840.jpg",
-        },
-        {
-          id: "t5",
-          name: "Chloe T.",
-          handle: "@chloe_t",
-          testimonial: "Fits everything I need for a 12-hour day on campus.",
-          imageSrc: "http://img.b2bpic.net/free-photo/cheerful-young-queer-girl-glasses-denim-jacket-standing-near-rainbow-wall-cross-hands-chest-smiling-camera-happy-lifestyle-urban-life-generation-concept_197531-30548.jpg",
-        },
       ]}
       title="What Students Say"
       description="Real stories from campuses across the country."
@@ -241,33 +127,9 @@ export default function LandingPage() {
       title="The UniPack Promise"
       description="Quality assurance for every student adventure."
       metrics={[
-        {
+        { id: "m1", value: "5k+", title: "Students Served", items: ["Across 50 states", "In over 300 universities"] },
-          id: "m1",
+        { id: "m2", value: "2y", title: "Warranty Coverage", items: ["Durable construction", "Reliable support"] },
-          value: "5k+",
+        { id: "m3", value: "100%", title: "Satisfaction Rate", items: ["30-day money-back", "Hassle-free returns"] },
-          title: "Students Served",
-          items: [
-            "Across 50 states",
-            "In over 300 universities",
-          ],
-        },
-        {
-          id: "m2",
-          value: "2y",
-          title: "Warranty Coverage",
-          items: [
-            "Durable construction",
-            "Reliable support",
-          ],
-        },
-        {
-          id: "m3",
-          value: "100%",
-          title: "Satisfaction Rate",
-          items: [
-            "30-day money-back",
-            "Hassle-free returns",
-          ],
-        },
       ]}
     />
   </div>
@@ -275,14 +137,8 @@ export default function LandingPage() {
   <div id="footer" data-section="footer">
       <FooterLogoReveal
       logoText="UniPack"
-      leftLink={{
+      leftLink={{ text: "Privacy Policy", href: "#" }}
-        text: "Privacy Policy",
+      rightLink={{ text: "Terms of Service", href: "#" }}
-        href: "#",
-      }}
-      rightLink={{
-        text: "Terms of Service",
-        href: "#",
-      }}
     />
   </div>
       </ReactLenis>