diff --git a/src/app/account/page.tsx b/src/app/account/page.tsx new file mode 100644 index 0000000..5e0cd4e --- /dev/null +++ b/src/app/account/page.tsx @@ -0,0 +1,109 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline'; +import FooterBaseCard from '@/components/sections/footer/FooterBaseCard'; + +export default function AccountPage() { + return ( + + + +
+
+

User Account

+

Manage your profile, orders, and settings.

+ {/* Placeholder for user account content */} +
+
+ + + + ); +} diff --git a/src/app/categories/page.tsx b/src/app/categories/page.tsx new file mode 100644 index 0000000..d3609ef --- /dev/null +++ b/src/app/categories/page.tsx @@ -0,0 +1,109 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline'; +import FooterBaseCard from '@/components/sections/footer/FooterBaseCard'; + +export default function CategoriesPage() { + return ( + + + +
+
+

Product Categories

+

Explore our wide range of design categories.

+ {/* Placeholder for categories content */} +
+
+ + + + ); +} diff --git a/src/app/checkout/page.tsx b/src/app/checkout/page.tsx new file mode 100644 index 0000000..7d6bb1e --- /dev/null +++ b/src/app/checkout/page.tsx @@ -0,0 +1,125 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import FooterBaseCard from '@/components/sections/footer/FooterBaseCard'; +import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial'; +import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline'; +import { Sparkles } from "lucide-react"; + +export default function CheckoutPage() { + return ( + + + + +
+ +
+ + + + + ); +} diff --git a/src/app/customer/dashboard/page.tsx b/src/app/customer/dashboard/page.tsx new file mode 100644 index 0000000..f067a08 --- /dev/null +++ b/src/app/customer/dashboard/page.tsx @@ -0,0 +1,92 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline'; + +export default function CustomerDashboardPage() { + const navItems = [ + { name: "Home", id: "/" }, + { name: "Products", id: "#products" }, + { name: "Features", id: "#features" }, + { name: "Testimonials", id: "#testimonials" }, + { name: "Pricing", id: "#pricing" }, + { name: "FAQ", id: "#faq" }, + { name: "Contact", id: "#contact" }, + { name: "Login", id: "/login" }, + { name: "Register", id: "/register" }, + { name: "Customer", id: "/customer/dashboard" }, + { name: "Seller", id: "/seller/dashboard" } + ]; + + const purchaseHistory = [ + { id: "p1", designName: "Modern Social Media Pack", date: "2023-10-26", price: "$29.99" }, + { id: "p2", designName: "Abstract Business Logo", date: "2023-09-15", price: "$49.99" }, + { id: "p3", designName: "Event Promotion Flyer", date: "2023-08-01", price: "$24.99" } + ]; + + return ( + + + + +
+
+

Customer Dashboard

+ +
+

Welcome, Customer!

+

Here you can manage your profile, view your purchase history, and access your downloaded designs.

+
+ +
+

Purchase History

+ {purchaseHistory.length === 0 ? ( +

You haven't made any purchases yet.

+ ) : ( +
+ + + + + + + + + + {purchaseHistory.map((item) => ( + + + + + + ))} + +
Design NameDatePrice
{item.designName}{item.date}{item.price}
+
+ )} +
+
+
+ + + ); +} \ No newline at end of file diff --git a/src/app/downloads/page.tsx b/src/app/downloads/page.tsx new file mode 100644 index 0000000..85b9da2 --- /dev/null +++ b/src/app/downloads/page.tsx @@ -0,0 +1,125 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import FooterBaseCard from '@/components/sections/footer/FooterBaseCard'; +import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial'; +import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline'; +import { Sparkles } from "lucide-react"; + +export default function DownloadsPage() { + return ( + + + + +
+ +
+ + + + + ); +} diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx new file mode 100644 index 0000000..7314090 --- /dev/null +++ b/src/app/login/page.tsx @@ -0,0 +1,100 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline'; +import Input from '@/components/form/Input'; +import ButtonTextUnderline from '@/components/button/ButtonTextUnderline'; +import { useState } from "react"; + +export default function LoginPage() { + const [email, setEmail] = useState(""); + const [password, setPassword] = useState(""); + + const handleLogin = (e: React.FormEvent) => { + e.preventDefault(); + console.log("Login submitted:", { email, password }); + // Add authentication logic here + }; + + const navItems = [ + { name: "Home", id: "/" }, + { name: "Products", id: "#products" }, + { name: "Features", id: "#features" }, + { name: "Testimonials", id: "#testimonials" }, + { name: "Pricing", id: "#pricing" }, + { name: "FAQ", id: "#faq" }, + { name: "Contact", id: "#contact" }, + { name: "Login", id: "/login" }, + { name: "Register", id: "/register" }, + { name: "Customer", id: "/customer/dashboard" }, + { name: "Seller", id: "/seller/dashboard" } + ]; + + return ( + + + + +
+
+

Login to DesignFlow

+
+
+ + +
+
+ + +
+ +

+ Don't have an account?{" "} + Register here +

+ +
+
+ + + ); +} \ No newline at end of file diff --git a/src/app/page.tsx b/src/app/page.tsx index 918538c..cc1d088 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -34,23 +34,33 @@ export default function LandingPage() { @@ -82,9 +92,9 @@ export default function LandingPage() { testimonialRotationInterval={5000} buttons={[ { - text: "Browse Designs", href: "#products"}, + text: "Browse Designs", href: "/products"}, { - text: "Become a Seller", href: "#contact"}, + text: "Become a Seller", href: "/seller-dashboard"}, ]} avatars={[ { @@ -287,7 +297,7 @@ export default function LandingPage() { text="Ready to elevate your brand or showcase your designs? Our team is here to help. Get in touch with us today for support, partnerships, or any inquiries." buttons={[ { - text: "Contact Us", href: "mailto:support@designflow.com"}, + text: "Contact Us", href: "/contact"}, ]} /> @@ -299,25 +309,25 @@ export default function LandingPage() { { title: "Products", items: [ { - label: "Canva Templates", href: "#products"}, + label: "Canva Templates", href: "/products"}, { - label: "Logos", href: "#products"}, + label: "Logos", href: "/products"}, { - label: "Social Media Kits", href: "#products"}, + label: "Social Media Kits", href: "/products"}, { - label: "Banners & Flyers", href: "#products"}, + label: "Banners & Flyers", href: "/products"}, ], }, { title: "Company", items: [ { - label: "About Us", href: "#about"}, + label: "About Us", href: "/about"}, { - label: "Features", href: "#features"}, + label: "Features", href: "/features"}, { - label: "Pricing", href: "#pricing"}, + label: "Pricing", href: "/pricing"}, { - label: "Contact", href: "#contact"}, + label: "Contact", href: "/contact"}, ], }, { @@ -337,4 +347,4 @@ export default function LandingPage() { ); -} +} \ No newline at end of file diff --git a/src/app/register/page.tsx b/src/app/register/page.tsx new file mode 100644 index 0000000..e96f6b9 --- /dev/null +++ b/src/app/register/page.tsx @@ -0,0 +1,130 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline'; +import Input from '@/components/form/Input'; +import ButtonTextUnderline from '@/components/button/ButtonTextUnderline'; +import { useState } from "react"; + +export default function RegisterPage() { + const [name, setName] = useState(""); + const [email, setEmail] = useState(""); + const [password, setPassword] = useState(""); + const [confirmPassword, setConfirmPassword] = useState(""); + + const handleRegister = (e: React.FormEvent) => { + e.preventDefault(); + if (password !== confirmPassword) { + alert("Passwords do not match!"); + return; + } + console.log("Registration submitted:", { name, email, password }); + // Add registration logic here + }; + + const navItems = [ + { name: "Home", id: "/" }, + { name: "Products", id: "#products" }, + { name: "Features", id: "#features" }, + { name: "Testimonials", id: "#testimonials" }, + { name: "Pricing", id: "#pricing" }, + { name: "FAQ", id: "#faq" }, + { name: "Contact", id: "#contact" }, + { name: "Login", id: "/login" }, + { name: "Register", id: "/register" }, + { name: "Customer", id: "/customer/dashboard" }, + { name: "Seller", id: "/seller/dashboard" } + ]; + + return ( + + + + +
+
+

Register for DesignFlow

+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+ +

+ Already have an account?{" "} + Login here +

+ +
+
+ + + ); +} \ No newline at end of file diff --git a/src/app/search/page.tsx b/src/app/search/page.tsx new file mode 100644 index 0000000..7e89f79 --- /dev/null +++ b/src/app/search/page.tsx @@ -0,0 +1,109 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline'; +import FooterBaseCard from '@/components/sections/footer/FooterBaseCard'; + +export default function SearchPage() { + return ( + + + +
+
+

Search Marketplace

+

Find the perfect design by searching our extensive catalog.

+ {/* Placeholder for search input and results */} +
+
+ + + + ); +} diff --git a/src/app/seller-dashboard/page.tsx b/src/app/seller-dashboard/page.tsx new file mode 100644 index 0000000..c133a7e --- /dev/null +++ b/src/app/seller-dashboard/page.tsx @@ -0,0 +1,109 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline'; +import FooterBaseCard from '@/components/sections/footer/FooterBaseCard'; + +export default function SellerDashboardPage() { + return ( + + + +
+
+

Seller Dashboard

+

Manage your products, sales, and earnings.

+ {/* Placeholder for seller dashboard content */} +
+
+ + + + ); +} diff --git a/src/app/seller/dashboard/page.tsx b/src/app/seller/dashboard/page.tsx new file mode 100644 index 0000000..eba6831 --- /dev/null +++ b/src/app/seller/dashboard/page.tsx @@ -0,0 +1,111 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline'; +import ButtonTextUnderline from '@/components/button/ButtonTextUnderline'; + +export default function SellerDashboardPage() { + const navItems = [ + { name: "Home", id: "/" }, + { name: "Products", id: "#products" }, + { name: "Features", id: "#features" }, + { name: "Testimonials", id: "#testimonials" }, + { name: "Pricing", id: "#pricing" }, + { name: "FAQ", id: "#faq" }, + { name: "Contact", id: "#contact" }, + { name: "Login", id: "/login" }, + { name: "Register", id: "/register" }, + { name: "Customer", id: "/customer/dashboard" }, + { name: "Seller", id: "/seller/dashboard" } + ]; + + const uploadedDesigns = [ + { id: "d1", name: "Modern Social Media Pack", status: "Active", sales: 15 }, + { id: "d2", name: "Ultimate Instagram Kit", status: "Active", sales: 10 }, + { id: "d3", name: "Professional Business Card", status: "Pending Review", sales: 0 } + ]; + + const handleUploadDesign = () => { + alert("Upload Design functionality coming soon!"); + }; + + const handleManageDesign = (designId: string) => { + alert(`Manage design ${designId} functionality coming soon!`); + }; + + return ( + + + + +
+
+

Seller Dashboard

+ +
+

Your Designs

+ +
+ +
+ {uploadedDesigns.length === 0 ? ( +

You haven't uploaded any designs yet. Click "Upload New Design" to get started!

+ ) : ( +
+ + + + + + + + + + + {uploadedDesigns.map((design) => ( + + + + + + + ))} + +
Design NameStatusSalesActions
{design.name}{design.status}{design.sales} + handleManageDesign(design.id)} + className="text-primary-cta hover:underline" + /> +
+
+ )} +
+
+
+ + + ); +} \ No newline at end of file diff --git a/src/app/styles/variables.css b/src/app/styles/variables.css index d2ffc19..7ad0651 100644 --- a/src/app/styles/variables.css +++ b/src/app/styles/variables.css @@ -10,15 +10,15 @@ --accent: #ffffff; --background-accent: #ffffff; */ - --background: #f5f5f5; - --card: #ffffff; - --foreground: #1c1c1c; - --primary-cta: #1f3251; - --primary-cta-text: #f5f5f5; - --secondary-cta: #ffffff; - --secondary-cta-text: #1c1c1c; - --accent: #15479c; - --background-accent: #a8cce8; + --background: #000000; + --card: #1a1a1a; + --foreground: #ffffff; + --primary-cta: #FFD700; + --primary-cta-text: #000000; + --secondary-cta: #333333; + --secondary-cta-text: #ffffff; + --accent: #666666; + --background-accent: #333333; /* text sizing - set by ThemeProvider */ /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem); diff --git a/src/app/wishlist/page.tsx b/src/app/wishlist/page.tsx new file mode 100644 index 0000000..38fa87a --- /dev/null +++ b/src/app/wishlist/page.tsx @@ -0,0 +1,109 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import ReactLenis from "lenis/react"; +import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline'; +import FooterBaseCard from '@/components/sections/footer/FooterBaseCard'; + +export default function WishlistPage() { + return ( + + + +
+
+

My Wishlist

+

View and manage your saved designs.

+ {/* Placeholder for wishlist content */} +
+
+ + + + ); +}