12 Commits

Author SHA1 Message Date
7be707904f Merge version_2 into main
Merge version_2 into main
2026-04-05 11:15:23 +00:00
a08fc27c45 Update src/app/order-confirmation/page.tsx 2026-04-05 11:15:19 +00:00
e31a1c9ee5 Update src/app/login/page.tsx 2026-04-05 11:15:19 +00:00
a05c85b5c2 Update src/app/checkout/page.tsx 2026-04-05 11:15:18 +00:00
0fdc9bb644 Update src/app/cart/page.tsx 2026-04-05 11:15:18 +00:00
c98dd83f3f Merge version_2 into main
Merge version_2 into main
2026-04-05 11:14:42 +00:00
eda35c3b3d Update src/app/page.tsx 2026-04-05 11:14:38 +00:00
40959a64aa Add src/app/order-confirmation/page.tsx 2026-04-05 11:14:37 +00:00
ea04be83be Add src/app/login/page.tsx 2026-04-05 11:14:37 +00:00
115a2af5f0 Add src/app/checkout/page.tsx 2026-04-05 11:14:36 +00:00
04c9f0b73e Add src/app/cart/page.tsx 2026-04-05 11:14:36 +00:00
e5eefe7cfc Merge version_1 into main
Merge version_1 into main
2026-04-05 11:13:30 +00:00
5 changed files with 177 additions and 173 deletions

41
src/app/cart/page.tsx Normal file
View File

@@ -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>
);
}

39
src/app/checkout/page.tsx Normal file
View File

@@ -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>
);
}

35
src/app/login/page.tsx Normal file
View File

@@ -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>
);
}

View File

@@ -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>
);
}

View File

@@ -29,21 +29,13 @@ export default function LandingPage() {
<NavbarStyleApple
navItems={[
{
name: "Home",
id: "hero",
},
name: "Home", id: "hero"},
{
name: "Collections",
id: "products",
},
name: "Collections", id: "products"},
{
name: "Reviews",
id: "testimonials",
},
name: "Reviews", id: "testimonials"},
{
name: "Contact",
id: "contact",
},
name: "Login", id: "/login"},
]}
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",
alt: "Sarah",
},
src: "http://img.b2bpic.net/free-photo/amazed-woman-walking-forest_23-2147835342.jpg", alt: "Sarah"},
{
src: "http://img.b2bpic.net/free-photo/young-girl-student-with-book-her-hands-goes-university_169016-66662.jpg",
alt: "Mark",
},
src: "http://img.b2bpic.net/free-photo/young-girl-student-with-book-her-hands-goes-university_169016-66662.jpg", 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",
alt: "Emily",
},
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"},
{
src: "http://img.b2bpic.net/free-photo/cute-helpful-friendlylooking-joyful-european-redhead-woman-show-thumb-left-smiling-delighted_1258-228840.jpg",
alt: "James",
},
src: "http://img.b2bpic.net/free-photo/cute-helpful-friendlylooking-joyful-european-redhead-woman-show-thumb-left-smiling-delighted_1258-228840.jpg", 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",
alt: "Chloe",
},
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"},
]}
avatarText="Join 5,000+ satisfied students"
buttons={[
{
text: "Shop Collections",
href: "#products",
},
text: "Shop Collections", href: "#products"},
]}
marqueeItems={[
{
type: "text",
text: "100% Water Resistant",
},
{
type: "text",
text: "Ergonomic Design",
},
{
type: "text",
text: "Laptop Protection",
},
{
type: "text",
text: "Sustainable Fabric",
},
{
type: "text",
text: "Campus Ready",
},
{ type: "text", text: "100% Water Resistant" },
{ 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: "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.",
},
{ id: "1", title: "Tech-Ready Compartment", 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: "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",
},
{ 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: "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" },
]}
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: "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",
},
{ 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: "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" },
]}
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: "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",
],
},
{ id: "m1", value: "5k+", 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={{
text: "Privacy Policy",
href: "#",
}}
rightLink={{
text: "Terms of Service",
href: "#",
}}
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ReactLenis>