Merge version_2 into main #4
29
src/app/cart/page.tsx
Normal file
29
src/app/cart/page.tsx
Normal file
@@ -0,0 +1,29 @@
|
||||
"use client";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import React from "react";
|
||||
|
||||
export default function CartPage() {
|
||||
return (
|
||||
<ThemeProvider>
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Products", id: "/product" },
|
||||
{ name: "Cart", id: "/cart" },
|
||||
{ name: "Dashboard", id: "/dashboard" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "FAQ", id: "/faq" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="Trackly"
|
||||
/>
|
||||
<main className="min-h-screen py-24 px-6 flex flex-col items-center">
|
||||
<h1 className="text-4xl font-bold mb-8">Your Shopping Cart</h1>
|
||||
<p>Your cart is empty. Start shopping for your favorite Trackly devices.</p>
|
||||
</main>
|
||||
<FooterSimple columns={[]} />
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
29
src/app/checkout/page.tsx
Normal file
29
src/app/checkout/page.tsx
Normal file
@@ -0,0 +1,29 @@
|
||||
"use client";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import React from "react";
|
||||
|
||||
export default function CheckoutPage() {
|
||||
return (
|
||||
<ThemeProvider>
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Products", id: "/product" },
|
||||
{ name: "Cart", id: "/cart" },
|
||||
{ name: "Dashboard", id: "/dashboard" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "FAQ", id: "/faq" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="Trackly"
|
||||
/>
|
||||
<main className="min-h-screen py-24 px-6 flex flex-col items-center">
|
||||
<h1 className="text-4xl font-bold mb-8">Checkout</h1>
|
||||
<p>Please enter your shipping and payment details to complete your order.</p>
|
||||
</main>
|
||||
<FooterSimple columns={[]} />
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
29
src/app/dashboard/page.tsx
Normal file
29
src/app/dashboard/page.tsx
Normal file
@@ -0,0 +1,29 @@
|
||||
"use client";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import React from "react";
|
||||
|
||||
export default function UserDashboardPage() {
|
||||
return (
|
||||
<ThemeProvider>
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Products", id: "/product" },
|
||||
{ name: "Cart", id: "/cart" },
|
||||
{ name: "Dashboard", id: "/dashboard" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "FAQ", id: "/faq" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="Trackly"
|
||||
/>
|
||||
<main className="min-h-screen py-24 px-6 flex flex-col items-center">
|
||||
<h1 className="text-4xl font-bold mb-8">Dashboard</h1>
|
||||
<p>Welcome back! Here you can manage your account, track orders, and view your devices.</p>
|
||||
</main>
|
||||
<FooterSimple columns={[]} />
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
29
src/app/order-confirmation/page.tsx
Normal file
29
src/app/order-confirmation/page.tsx
Normal file
@@ -0,0 +1,29 @@
|
||||
"use client";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import React from "react";
|
||||
|
||||
export default function OrderConfirmationPage() {
|
||||
return (
|
||||
<ThemeProvider>
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Products", id: "/product" },
|
||||
{ name: "Cart", id: "/cart" },
|
||||
{ name: "Dashboard", id: "/dashboard" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "FAQ", id: "/faq" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="Trackly"
|
||||
/>
|
||||
<main className="min-h-screen py-24 px-6 flex flex-col items-center">
|
||||
<h1 className="text-4xl font-bold mb-8">Thank You!</h1>
|
||||
<p>Your order has been placed successfully.</p>
|
||||
</main>
|
||||
<FooterSimple columns={[]} />
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
@@ -7,9 +7,10 @@ import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
||||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
||||
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
||||
import { Activity, MapPin } from "lucide-react";
|
||||
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
|
||||
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import { Activity, MapPin, Star } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -30,8 +31,8 @@ export default function LandingPage() {
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Products", id: "/product" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Shop", id: "/shop" },
|
||||
{ name: "Reviews", id: "/reviews" },
|
||||
{ name: "FAQ", id: "/faq" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
@@ -45,8 +46,8 @@ export default function LandingPage() {
|
||||
logoText="Trackly"
|
||||
description="Never Lose What Matters Again. Experience peace of mind with the world's most advanced smart Bluetooth GPS tracker."
|
||||
buttons={[
|
||||
{ text: "Buy Now", href: "/product" },
|
||||
{ text: "Learn More", href: "/about" },
|
||||
{ text: "Buy Now", href: "/shop" },
|
||||
{ text: "Learn More", href: "#features" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/top-view-tampon-pattern_23-2148163081.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
@@ -71,18 +72,14 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="split"
|
||||
<TestimonialCardFifteen
|
||||
testimonial="Trackly has been an absolute game changer for my daily routine. I can finally travel without worrying about my essentials."
|
||||
rating={5}
|
||||
author="Sarah J., Verified Buyer"
|
||||
avatars={[{ src: "http://img.b2bpic.net/free-photo/closeup-happy-business-man-standing-outside_1262-3488.jpg?_wi=1", alt: "Customer" }]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", title: "Great!", quote: "I found my dog in seconds.", name: "Sarah J.", role: "Pet Owner", imageSrc: "http://img.b2bpic.net/free-photo/closeup-happy-business-man-standing-outside_1262-3488.jpg?_wi=1" },
|
||||
{ id: "2", title: "Amazing", quote: "Perfect for my overseas trips.", name: "Mark D.", role: "Traveler", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-holding-dog-outside_23-2149003357.jpg" },
|
||||
{ id: "3", title: "Life Saver", quote: "Never lost my keys again.", name: "Emily K.", role: "Design Lead", imageSrc: "http://img.b2bpic.net/free-photo/cute-young-girl-dressed-up-leather-jacket-seat-bench-near-pier-lake_231208-6617.jpg" },
|
||||
{ id: "4", title: "Awesome", quote: "The battery life is unmatched.", name: "David W.", role: "Engineer", imageSrc: "http://img.b2bpic.net/free-photo/serious-athlete-with-earphones-leaning-bridge_1262-5513.jpg?_wi=1" },
|
||||
{ id: "5", title: "Essential", quote: "I can't imagine my life without it now.", name: "Alex R.", role: "Cyclist", imageSrc: "http://img.b2bpic.net/free-photo/serious-athlete-with-earphones-leaning-bridge_1262-5513.jpg?_wi=2" }
|
||||
]}
|
||||
title="Loved by Thousands"
|
||||
description="See why people trust Trackly for their pets and personal belongings."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -101,15 +98,28 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardTwo
|
||||
<PricingCardFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Simple Pricing"
|
||||
description="Choose the tracker that fits your lifestyle."
|
||||
description="Choose the plan that fits your tracking needs."
|
||||
plans={[
|
||||
{ id: "pl1", badge: "Essential", price: "$29", subtitle: "Perfect for essentials", buttons: [{ text: "Get Started", href: "#" }], features: ["Bluetooth tracking", "Waterproof"] },
|
||||
{ id: "pl2", badge: "Pro", price: "$49", subtitle: "For global travelers", buttons: [{ text: "Get Started", href: "#" }], features: ["GPS tracking", "Global coverage", "Extended battery"] }
|
||||
{ id: "pl1", tag: "Essential", price: "$29", period: "one-time", description: "Perfect for your everyday items.", button: {text: "Buy Now"}, featuresTitle: "Core Benefits", features: ["Bluetooth Range", "App Integration", "Waterproof"] },
|
||||
{ id: "pl2", tag: "Pro", price: "$49", period: "one-time", description: "For global travelers and pets.", button: {text: "Buy Now"}, featuresTitle: "Pro Benefits", features: ["GPS/LTE Coverage", "Long-Range", "Extended Battery"] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
sideTitle="Frequently Asked Questions"
|
||||
sideDescription="Everything you need to know about our trackers."
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{ id: "f1", title: "How do I sync my tracker?", content: "Simple, just tap the add button in our app." },
|
||||
{ id: "f2", title: "Is it waterproof?", content: "Yes, all models are IP67 rated." },
|
||||
{ id: "f3", title: "Do you ship globally?", content: "Yes, we ship to over 100 countries." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -117,15 +127,15 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{ title: "Product", items: [{ label: "Tracker", href: "/product" }, { label: "Features", href: "#" }] },
|
||||
{ title: "Company", items: [{ label: "About", href: "/about" }, { label: "FAQ", href: "/faq" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy", href: "#" }, { label: "Terms", href: "#" }] }
|
||||
{ title: "Product", items: [{ label: "Shop All", href: "/shop" }, { label: "Reviews", href: "/reviews" }] },
|
||||
{ title: "Support", items: [{ label: "FAQ", href: "/faq" }, { label: "Contact", href: "/contact" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
|
||||
]}
|
||||
bottomLeftText="© 2024 TracklyHub"
|
||||
bottomRightText="Built with love."
|
||||
bottomRightText="Secure your world."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
47
src/app/product/[id]/page.tsx
Normal file
47
src/app/product/[id]/page.tsx
Normal file
@@ -0,0 +1,47 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
|
||||
export default function ProductDetailPage({ params }: { params: { id: string } }) {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="icon-arrow"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Shop", id: "/shop" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "FAQ", id: "/faq" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="Trackly"
|
||||
/>
|
||||
<div className="pt-32 pb-20 container mx-auto px-4">
|
||||
<h1 className="text-4xl font-bold mb-4">Product Details: {params.id}</h1>
|
||||
<p className="text-xl">This is the detail view for product {params.id}. Discover features and technical specifications.</p>
|
||||
</div>
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{ title: "Product", items: [{ label: "Shop Catalog", href: "/shop" }] },
|
||||
{ title: "Company", items: [{ label: "About", href: "/about" }] }
|
||||
]}
|
||||
bottomLeftText="© 2024 TracklyHub"
|
||||
/>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
57
src/app/shop/page.tsx
Normal file
57
src/app/shop/page.tsx
Normal file
@@ -0,0 +1,57 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import ProductCatalogItem from '@/components/ecommerce/productCatalog/ProductCatalogItem';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
|
||||
export default function ShopPage() {
|
||||
const products = [
|
||||
{ id: "1", name: "Trackly Pro", price: "$49", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/top-view-tampon-pattern_23-2148163081.jpg?_wi=1" },
|
||||
{ id: "2", name: "Trackly Mini", price: "$29", rating: 4, imageSrc: "http://img.b2bpic.net/free-photo/top-view-tampon-pattern_23-2148163081.jpg?_wi=2" }
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="icon-arrow"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Shop", id: "/shop" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "FAQ", id: "/faq" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
]}
|
||||
brandName="Trackly"
|
||||
/>
|
||||
<div className="pt-32 pb-20 container mx-auto px-4">
|
||||
<h1 className="text-4xl font-bold mb-10">Our Products</h1>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
{products.map((p) => (
|
||||
<ProductCatalogItem key={p.id} product={p as any} />
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{ title: "Product", items: [{ label: "Shop Catalog", href: "/shop" }] },
|
||||
{ title: "Company", items: [{ label: "About", href: "/about" }] }
|
||||
]}
|
||||
bottomLeftText="© 2024 TracklyHub"
|
||||
/>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user