Compare commits
12 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 05bc79a156 | |||
| 692f9cfc32 | |||
| 4de2c526b4 | |||
| c56fe612fc | |||
| 9cd6b632fc | |||
| 8c8480b65d | |||
| a468b6a4c5 | |||
| 923cc2d9c6 | |||
| 4b170dffda | |||
| 722395accd | |||
| 403fac2872 | |||
| 663b7221d9 |
47
src/app/computer-types/page.tsx
Normal file
47
src/app/computer-types/page.tsx
Normal file
@@ -0,0 +1,47 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
|
import ReactLenis from "lenis/react";
|
||||||
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||||
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||||
|
|
||||||
|
export default function ComputerTypesPage() {
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="bounce-effect"
|
||||||
|
defaultTextAnimation="background-highlight"
|
||||||
|
borderRadius="soft"
|
||||||
|
contentWidth="compact"
|
||||||
|
sizing="largeSizeMediumTitles"
|
||||||
|
background="circleGradient"
|
||||||
|
cardStyle="outline"
|
||||||
|
primaryButtonStyle="double-inset"
|
||||||
|
secondaryButtonStyle="glass"
|
||||||
|
headingFontWeight="semibold"
|
||||||
|
>
|
||||||
|
<ReactLenis root>
|
||||||
|
<NavbarLayoutFloatingInline
|
||||||
|
navItems={[
|
||||||
|
{ name: "Home", id: "/" },
|
||||||
|
{ name: "Computers", id: "/computer-types" },
|
||||||
|
{ name: "Pricing", id: "/pricing" },
|
||||||
|
]}
|
||||||
|
brandName="TechLaptops"
|
||||||
|
button={{ text: "Contact Us", href: "/contact" }}
|
||||||
|
/>
|
||||||
|
<ProductCardOne
|
||||||
|
title="Our Computer Range"
|
||||||
|
description="Explore our curated selection of professional-grade machines."
|
||||||
|
gridVariant="uniform-all-items-equal"
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
products={[
|
||||||
|
{ id: "p1", name: "Pro Laptop 15", price: "$1,299", imageSrc: "http://img.b2bpic.net/free-photo/still-life-device-table_23-2150994381.jpg?_wi=1" },
|
||||||
|
{ id: "p2", name: "Workstation Pro", price: "$2,499", imageSrc: "http://img.b2bpic.net/free-photo/laptop-marble-table_53876-63465.jpg?_wi=1" },
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ReactLenis>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
71
src/app/introduction/page.tsx
Normal file
71
src/app/introduction/page.tsx
Normal file
@@ -0,0 +1,71 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
|
import ReactLenis from "lenis/react";
|
||||||
|
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
|
||||||
|
import SplitAbout from '@/components/sections/about/SplitAbout';
|
||||||
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||||
|
import { CheckCircle } from 'lucide-react';
|
||||||
|
|
||||||
|
export default function IntroductionPage() {
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="bounce-effect"
|
||||||
|
defaultTextAnimation="background-highlight"
|
||||||
|
borderRadius="soft"
|
||||||
|
contentWidth="compact"
|
||||||
|
sizing="largeSizeMediumTitles"
|
||||||
|
background="circleGradient"
|
||||||
|
cardStyle="outline"
|
||||||
|
primaryButtonStyle="double-inset"
|
||||||
|
secondaryButtonStyle="glass"
|
||||||
|
headingFontWeight="semibold"
|
||||||
|
>
|
||||||
|
<ReactLenis root>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarLayoutFloatingInline
|
||||||
|
navItems={[
|
||||||
|
{ name: "Home", id: "/" },
|
||||||
|
{ name: "Introduction", id: "/introduction" },
|
||||||
|
{ name: "Laptops", id: "/laptops" },
|
||||||
|
{ name: "Pricing", id: "/pricing" },
|
||||||
|
]}
|
||||||
|
brandName="TechLaptops"
|
||||||
|
button={{ text: "Contact Us", href: "/contact" }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="hero" data-section="hero">
|
||||||
|
<HeroSplitTestimonial
|
||||||
|
background={{ variant: "gradient-bars" }}
|
||||||
|
title="The Future of Performance"
|
||||||
|
description="Welcome to TechLaptops. We bridge the gap between innovation and power with our curated selection of professional-grade machines."
|
||||||
|
imageSrc="http://img.b2bpic.net/free-photo/still-life-device-table_23-2150994381.jpg?_wi=2"
|
||||||
|
mediaAnimation="slide-up"
|
||||||
|
testimonials={[
|
||||||
|
{ name: "Alice Johnson", handle: "@alicej", testimonial: "The best laptop I've ever owned. Incredible power and design.", rating: 5 },
|
||||||
|
{ name: "Bob Smith", handle: "@bobsmith", testimonial: "A game-changer for my professional workflow.", rating: 5 }
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="about" data-section="about">
|
||||||
|
<SplitAbout
|
||||||
|
useInvertedBackground={false}
|
||||||
|
title="About Our Mission"
|
||||||
|
description="We are dedicated to providing cutting-edge technology that empowers professionals to achieve their goals with ease and efficiency."
|
||||||
|
buttons={[
|
||||||
|
{ text: "View Laptops", href: "/laptops" },
|
||||||
|
]}
|
||||||
|
bulletPoints={[
|
||||||
|
{ title: "High Performance", description: "Experience lightning-fast speeds for any professional task." },
|
||||||
|
{ title: "Elegant Design", description: "Crafted with premium materials for a sleek, modern look." },
|
||||||
|
{ title: "Reliability", description: "Built to last and perform under the toughest conditions." }
|
||||||
|
]}
|
||||||
|
textboxLayout="default"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ReactLenis>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -2,12 +2,11 @@
|
|||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import ReactLenis from "lenis/react";
|
import ReactLenis from "lenis/react";
|
||||||
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
||||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
||||||
|
|
||||||
export default function LandingPage() {
|
export default function ProductsPage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
defaultButtonVariant="bounce-effect"
|
defaultButtonVariant="bounce-effect"
|
||||||
@@ -25,98 +24,29 @@ export default function LandingPage() {
|
|||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarLayoutFloatingInline
|
<NavbarLayoutFloatingInline
|
||||||
navItems={[
|
navItems={[
|
||||||
{
|
{ name: "Home", id: "/" },
|
||||||
name: "Home",
|
{ name: "Laptops", id: "/laptops" },
|
||||||
id: "/",
|
{ name: "Pricing", id: "/pricing" },
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Laptops",
|
|
||||||
id: "/laptops",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Pricing",
|
|
||||||
id: "/pricing",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
brandName="TechLaptops"
|
brandName="TechLaptops"
|
||||||
button={{
|
button={{
|
||||||
text: "Contact Us",
|
text: "Contact Us", href: "/contact"}}
|
||||||
href: "/contact",
|
|
||||||
}}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="product-list" data-section="product-list">
|
<div id="product-list" data-section="product-list">
|
||||||
<ProductCardOne
|
<ProductCardFour
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
gridVariant="four-items-2x2-equal-grid"
|
gridVariant="four-items-2x2-equal-grid"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
|
title="Computers & Laptops"
|
||||||
|
description="Browse our comprehensive collection of computing devices for every need."
|
||||||
products={[
|
products={[
|
||||||
{
|
{ id: "p1", name: "Pro Workstation", price: "$1299", variant: "High Performance", imageSrc: "http://img.b2bpic.net/free-photo/professional-businesswoman-with-glasses-meeting-with-laptop_23-2148824809.jpg?_wi=2" },
|
||||||
id: "p1",
|
{ id: "p2", name: "Gaming Beast", price: "$1599", variant: "Gaming", imageSrc: "http://img.b2bpic.net/free-photo/party-space-ready-online-celebration_23-2149347285.jpg?_wi=2" },
|
||||||
name: "Pro Workstation",
|
{ id: "p3", name: "Slim Ultrabook", price: "$999", variant: "Portable", imageSrc: "http://img.b2bpic.net/free-photo/laptop-marble-table_53876-63465.jpg?_wi=2" },
|
||||||
price: "$1299",
|
{ id: "p4", name: "Hybrid 360", price: "$1199", variant: "2-in-1", imageSrc: "http://img.b2bpic.net/free-photo/handsome-freelancer-using-tablet-laptop-computer-check-his-business-cafe_342744-45.jpg" },
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-businesswoman-with-glasses-meeting-with-laptop_23-2148824809.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p2",
|
|
||||||
name: "Gaming Beast",
|
|
||||||
price: "$1599",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/party-space-ready-online-celebration_23-2149347285.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p3",
|
|
||||||
name: "Slim Ultrabook",
|
|
||||||
price: "$999",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/laptop-marble-table_53876-63465.jpg?_wi=2",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p4",
|
|
||||||
name: "Hybrid 360",
|
|
||||||
price: "$1199",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-freelancer-using-tablet-laptop-computer-check-his-business-cafe_342744-45.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p5",
|
|
||||||
name: "Office Pro",
|
|
||||||
price: "$899",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/overhead-view-digital-tablet-with-coffee-earphone-pen-holders-gray-desk_23-2148052597.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p6",
|
|
||||||
name: "Student Basic",
|
|
||||||
price: "$599",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-scrolling-laptop-check-social-media-feed_482257-111833.jpg",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
title="Our Collection"
|
|
||||||
description="From workstations to thin ultrabooks."
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="feature" data-section="feature">
|
|
||||||
<FeatureCardTwentyEight
|
|
||||||
animationType="slide-up"
|
|
||||||
textboxLayout="default"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
title="Advanced Features"
|
|
||||||
description="Cutting edge technology built in."
|
|
||||||
features={[
|
|
||||||
{
|
|
||||||
id: "f1",
|
|
||||||
title: "Thermal Control",
|
|
||||||
subtitle: "Quiet fans",
|
|
||||||
category: "Hardware",
|
|
||||||
value: "High",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "f2",
|
|
||||||
title: "Battery Life",
|
|
||||||
subtitle: "12+ hours",
|
|
||||||
category: "Energy",
|
|
||||||
value: "Max",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -124,32 +54,8 @@ export default function LandingPage() {
|
|||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterSimple
|
<FooterSimple
|
||||||
columns={[
|
columns={[
|
||||||
{
|
{ title: "Product", items: [{ label: "Laptops", href: "/laptops" }, { label: "Support", href: "#" }] },
|
||||||
title: "Product",
|
{ title: "Company", items: [{ label: "About", href: "#" }, { label: "Pricing", href: "/pricing" }] },
|
||||||
items: [
|
|
||||||
{
|
|
||||||
label: "Laptops",
|
|
||||||
href: "/laptops",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "Support",
|
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Company",
|
|
||||||
items: [
|
|
||||||
{
|
|
||||||
label: "About",
|
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "Pricing",
|
|
||||||
href: "/pricing",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
bottomLeftText="© 2024 TechLaptops"
|
bottomLeftText="© 2024 TechLaptops"
|
||||||
bottomRightText="All rights reserved."
|
bottomRightText="All rights reserved."
|
||||||
|
|||||||
275
src/app/page.tsx
275
src/app/page.tsx
@@ -28,291 +28,34 @@ export default function LandingPage() {
|
|||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarLayoutFloatingInline
|
<NavbarLayoutFloatingInline
|
||||||
navItems={[
|
navItems={[
|
||||||
{
|
{ name: "Home", id: "/" },
|
||||||
name: "Home",
|
{ name: "Computers", id: "/computer-types" },
|
||||||
id: "/",
|
{ name: "Pricing", id: "/pricing" },
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Laptops",
|
|
||||||
id: "/laptops",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Pricing",
|
|
||||||
id: "/pricing",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
brandName="TechLaptops"
|
brandName="TechLaptops"
|
||||||
button={{
|
button={{ text: "Contact Us", href: "/contact" }}
|
||||||
text: "Contact Us",
|
|
||||||
href: "/contact",
|
|
||||||
}}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div id="hero" data-section="hero">
|
||||||
<HeroSplitTestimonial
|
<HeroSplitTestimonial
|
||||||
background={{
|
background={{ variant: "gradient-bars" }}
|
||||||
variant: "gradient-bars",
|
|
||||||
}}
|
|
||||||
title="Unleash Your Productivity"
|
title="Unleash Your Productivity"
|
||||||
description="Premium laptops designed for modern professionals and creators. Find your perfect machine today."
|
description="Premium laptops designed for modern professionals and creators. Find your perfect machine today."
|
||||||
testimonials={[
|
testimonials={[
|
||||||
{
|
{ name: "Alice J.", handle: "@alice", testimonial: "The best laptop I ever bought.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/still-life-device-table_23-2150994381.jpg?_wi=1", imageAlt: "laptop on desk modern" },
|
||||||
name: "Alice J.",
|
{ name: "Bob S.", handle: "@bob", testimonial: "Incredible performance and speed.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/business-graphs-performance-metrics-monitors-office_482257-126569.jpg", imageAlt: "laptop on desk modern" },
|
||||||
handle: "@alice",
|
|
||||||
testimonial: "The best laptop I ever bought.",
|
|
||||||
rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-device-table_23-2150994381.jpg?_wi=1",
|
|
||||||
imageAlt: "laptop on desk modern",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Bob S.",
|
|
||||||
handle: "@bob",
|
|
||||||
testimonial: "Incredible performance and speed.",
|
|
||||||
rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/business-graphs-performance-metrics-monitors-office_482257-126569.jpg",
|
|
||||||
imageAlt: "laptop on desk modern",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Charlie M.",
|
|
||||||
handle: "@charlie",
|
|
||||||
testimonial: "Excellent service and products.",
|
|
||||||
rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-businesswoman-with-glasses-meeting-with-laptop_23-2148824809.jpg?_wi=1",
|
|
||||||
imageAlt: "laptop on desk modern",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Diana K.",
|
|
||||||
handle: "@diana",
|
|
||||||
testimonial: "Sleek and very powerful.",
|
|
||||||
rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/party-space-ready-online-celebration_23-2149347285.jpg?_wi=1",
|
|
||||||
imageAlt: "laptop on desk modern",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "Evan R.",
|
|
||||||
handle: "@evan",
|
|
||||||
testimonial: "A game changer for my work.",
|
|
||||||
rating: 5,
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/laptop-marble-table_53876-63465.jpg?_wi=1",
|
|
||||||
imageAlt: "laptop on desk modern",
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/still-life-device-table_23-2150994381.jpg?_wi=2"
|
imageSrc="http://img.b2bpic.net/free-photo/still-life-device-table_23-2150994381.jpg?_wi=2"
|
||||||
mediaAnimation="slide-up"
|
mediaAnimation="slide-up"
|
||||||
avatars={[
|
|
||||||
{
|
|
||||||
src: "http://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman_74855-1573.jpg",
|
|
||||||
alt: "Portrait 1",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
src: "http://img.b2bpic.net/free-photo/positive-middle-aged-business-leader-window_1262-5388.jpg",
|
|
||||||
alt: "Portrait 2",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
src: "http://img.b2bpic.net/free-photo/closeup-handsome-middle-aged-business-leader_1262-4822.jpg",
|
|
||||||
alt: "Portrait 3",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
src: "http://img.b2bpic.net/free-photo/confident-entrepreneur-satisfied-with-own-success_1163-5474.jpg",
|
|
||||||
alt: "Portrait 4",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
src: "http://img.b2bpic.net/free-photo/young-stylish-smiling-man-co-working-office-startup-freelancer-holding-using-tablet_285396-9048.jpg",
|
|
||||||
alt: "Portrait 5",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
avatarText="Trusted by 5,000+ professionals"
|
|
||||||
marqueeItems={[
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: "Intel Core i9",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: "NVIDIA RTX 4080",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: "32GB RAM",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: "4K OLED Display",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "text",
|
|
||||||
text: "1TB SSD",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="about" data-section="about">
|
|
||||||
<TextAbout
|
|
||||||
useInvertedBackground={false}
|
|
||||||
title="Empowering Your Tech Experience"
|
|
||||||
buttons={[
|
|
||||||
{
|
|
||||||
text: "Learn More",
|
|
||||||
href: "/laptops",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="testimonial-section" data-section="testimonial-section">
|
|
||||||
<TestimonialCardTen
|
|
||||||
textboxLayout="split"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
testimonials={[
|
|
||||||
{
|
|
||||||
id: "t1",
|
|
||||||
title: "Great support",
|
|
||||||
quote: "Excellent team.",
|
|
||||||
name: "A. J.",
|
|
||||||
role: "CEO",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/businessman-smiling-looking-camera_23-2148112827.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "t2",
|
|
||||||
title: "Solid laptop",
|
|
||||||
quote: "Reliable gear.",
|
|
||||||
name: "B. S.",
|
|
||||||
role: "CTO",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/young-attractive-smiling-man-sitting-co-working-open-office-holding-laptop_285396-9047.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "t3",
|
|
||||||
title: "Fast delivery",
|
|
||||||
quote: "Very prompt.",
|
|
||||||
name: "C. M.",
|
|
||||||
role: "Dev",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-young-businessman_23-2147839983.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "t4",
|
|
||||||
title: "Perfect fit",
|
|
||||||
quote: "Ideal size.",
|
|
||||||
name: "D. K.",
|
|
||||||
role: "Mgr",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-confident-asian-man-with-arms-crossed_1262-884.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "t5",
|
|
||||||
title: "Great value",
|
|
||||||
quote: "Worth it.",
|
|
||||||
name: "E. R.",
|
|
||||||
role: "Des",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-happy-business-man-standing-outside_1262-3488.jpg",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
title="What Our Customers Say"
|
|
||||||
description="Join thousands of professionals choosing us."
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="team" data-section="team">
|
|
||||||
<TeamCardTen
|
|
||||||
useInvertedBackground={false}
|
|
||||||
title="Meet Our Experts"
|
|
||||||
tag="Our Team"
|
|
||||||
membersAnimation="slide-up"
|
|
||||||
memberVariant="card"
|
|
||||||
members={[
|
|
||||||
{
|
|
||||||
id: "m1",
|
|
||||||
name: "John Doe",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/people-working-as-team-company_23-2149136890.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "m2",
|
|
||||||
name: "Jane Smith",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/male-graphic-designer-talking-mobile-phone-while-coworker-looking-computer_1170-967.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "m3",
|
|
||||||
name: "Alex Riv",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/man-typing-computer-keyboard-home-office_329181-17546.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "m4",
|
|
||||||
name: "Sam K",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-with-laptop-headphones_23-2148205659.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "m5",
|
|
||||||
name: "Pat L",
|
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/man-using-laptop-urban-environment_23-2147961499.jpg",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="faq" data-section="faq">
|
|
||||||
<FaqSplitText
|
|
||||||
useInvertedBackground={false}
|
|
||||||
sideTitle="Frequently Asked Questions"
|
|
||||||
faqsAnimation="slide-up"
|
|
||||||
faqs={[
|
|
||||||
{
|
|
||||||
id: "f1",
|
|
||||||
title: "How do I ship my order?",
|
|
||||||
content: "We ship globally via trusted partners.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "f2",
|
|
||||||
title: "Warranty coverage?",
|
|
||||||
content: "All laptops come with 2-year manufacturer warranty.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "f3",
|
|
||||||
title: "Return policy?",
|
|
||||||
content: "You can return within 30 days of purchase.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "f4",
|
|
||||||
title: "Payment methods?",
|
|
||||||
content: "We accept major credit cards and PayPal.",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "f5",
|
|
||||||
title: "Support hours?",
|
|
||||||
content: "Our support is available 24/7.",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterSimple
|
<FooterSimple
|
||||||
columns={[
|
columns={[
|
||||||
{
|
{ title: "Product", items: [{ label: "Computers", href: "/computer-types" }, { label: "Support", href: "#" }] },
|
||||||
title: "Product",
|
{ title: "Company", items: [{ label: "About", href: "#" }, { label: "Pricing", href: "/pricing" }] },
|
||||||
items: [
|
|
||||||
{
|
|
||||||
label: "Laptops",
|
|
||||||
href: "/laptops",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "Support",
|
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Company",
|
|
||||||
items: [
|
|
||||||
{
|
|
||||||
label: "About",
|
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "Pricing",
|
|
||||||
href: "/pricing",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
bottomLeftText="© 2024 TechLaptops"
|
bottomLeftText="© 2024 TechLaptops"
|
||||||
bottomRightText="All rights reserved."
|
bottomRightText="All rights reserved."
|
||||||
|
|||||||
@@ -2,12 +2,10 @@
|
|||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import ReactLenis from "lenis/react";
|
import ReactLenis from "lenis/react";
|
||||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
||||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||||
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
|
|
||||||
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
|
|
||||||
|
|
||||||
export default function LandingPage() {
|
export default function PricingPage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
defaultButtonVariant="bounce-effect"
|
defaultButtonVariant="bounce-effect"
|
||||||
@@ -22,163 +20,26 @@ export default function LandingPage() {
|
|||||||
headingFontWeight="semibold"
|
headingFontWeight="semibold"
|
||||||
>
|
>
|
||||||
<ReactLenis root>
|
<ReactLenis root>
|
||||||
<div id="nav" data-section="nav">
|
<NavbarLayoutFloatingInline
|
||||||
<NavbarLayoutFloatingInline
|
navItems={[
|
||||||
navItems={[
|
{ name: "Home", id: "/" },
|
||||||
{
|
{ name: "Computers", id: "/computer-types" },
|
||||||
name: "Home",
|
{ name: "Pricing", id: "/pricing" },
|
||||||
id: "/",
|
]}
|
||||||
},
|
brandName="TechLaptops"
|
||||||
{
|
button={{ text: "Contact Us", href: "/contact" }}
|
||||||
name: "Laptops",
|
/>
|
||||||
id: "/laptops",
|
<PricingCardEight
|
||||||
},
|
title="Choose Your Plan"
|
||||||
{
|
description="Find the perfect solution for your needs."
|
||||||
name: "Pricing",
|
animationType="slide-up"
|
||||||
id: "/pricing",
|
useInvertedBackground={false}
|
||||||
},
|
textboxLayout="default"
|
||||||
]}
|
plans={[
|
||||||
brandName="TechLaptops"
|
{ id: "basic", badge: "Starter", price: "$999", subtitle: "Essential performance", buttons: [{ text: "Buy Now", href: "#" }], features: ["Core i5", "8GB RAM", "256GB SSD"] },
|
||||||
button={{
|
{ id: "pro", badge: "Professional", price: "$1,599", subtitle: "Maximum productivity", buttons: [{ text: "Buy Now", href: "#" }], features: ["Core i7", "16GB RAM", "512GB SSD"] },
|
||||||
text: "Contact Us",
|
]}
|
||||||
href: "/contact",
|
/>
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="pricing-list" data-section="pricing-list">
|
|
||||||
<PricingCardThree
|
|
||||||
animationType="slide-up"
|
|
||||||
textboxLayout="default"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
plans={[
|
|
||||||
{
|
|
||||||
id: "basic",
|
|
||||||
price: "$599",
|
|
||||||
name: "Basic",
|
|
||||||
buttons: [
|
|
||||||
{
|
|
||||||
text: "Buy Now",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Core i3",
|
|
||||||
"8GB RAM",
|
|
||||||
"256GB SSD",
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "pro",
|
|
||||||
price: "$1099",
|
|
||||||
name: "Professional",
|
|
||||||
buttons: [
|
|
||||||
{
|
|
||||||
text: "Buy Now",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Core i7",
|
|
||||||
"16GB RAM",
|
|
||||||
"512GB SSD",
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "ultra",
|
|
||||||
price: "$1699",
|
|
||||||
name: "Ultra Performance",
|
|
||||||
buttons: [
|
|
||||||
{
|
|
||||||
text: "Buy Now",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Core i9",
|
|
||||||
"32GB RAM",
|
|
||||||
"1TB SSD",
|
|
||||||
],
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
title="Simple Pricing"
|
|
||||||
description="Tailored plans for all needs."
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="pricing" data-section="pricing">
|
|
||||||
<PricingCardTwo
|
|
||||||
animationType="slide-up"
|
|
||||||
textboxLayout="default"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
title="Plan Customization"
|
|
||||||
description="Choose the perfect hardware for your specific requirements."
|
|
||||||
plans={[
|
|
||||||
{
|
|
||||||
id: "p1",
|
|
||||||
badge: "Popular",
|
|
||||||
price: "$899",
|
|
||||||
subtitle: "Work ready",
|
|
||||||
buttons: [
|
|
||||||
{
|
|
||||||
text: "Select",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"SSD Storage",
|
|
||||||
"HD Screen",
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p2",
|
|
||||||
badge: "Advanced",
|
|
||||||
price: "$1299",
|
|
||||||
subtitle: "Professional",
|
|
||||||
buttons: [
|
|
||||||
{
|
|
||||||
text: "Select",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Advanced Cooling",
|
|
||||||
"Dedicated GPU",
|
|
||||||
],
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
|
||||||
<FooterSimple
|
|
||||||
columns={[
|
|
||||||
{
|
|
||||||
title: "Product",
|
|
||||||
items: [
|
|
||||||
{
|
|
||||||
label: "Laptops",
|
|
||||||
href: "/laptops",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "Support",
|
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Company",
|
|
||||||
items: [
|
|
||||||
{
|
|
||||||
label: "About",
|
|
||||||
href: "#",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "Pricing",
|
|
||||||
href: "/pricing",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
bottomLeftText="© 2024 TechLaptops"
|
|
||||||
bottomRightText="All rights reserved."
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user