12 Commits

Author SHA1 Message Date
05bc79a156 Update src/app/introduction/page.tsx 2026-04-22 14:15:49 +00:00
692f9cfc32 Update src/app/introduction/page.tsx 2026-04-22 14:15:19 +00:00
4de2c526b4 Update src/app/introduction/page.tsx 2026-04-22 14:14:53 +00:00
c56fe612fc Update src/app/pricing/page.tsx 2026-04-22 14:14:23 +00:00
9cd6b632fc Update src/app/page.tsx 2026-04-22 14:14:23 +00:00
8c8480b65d Add src/app/introduction/page.tsx 2026-04-22 14:14:22 +00:00
a468b6a4c5 Add src/app/computer-types/page.tsx 2026-04-22 14:14:22 +00:00
923cc2d9c6 Merge version_2 into main
Merge version_2 into main
2026-04-22 14:00:06 +00:00
4b170dffda Update src/app/pricing/page.tsx 2026-04-22 14:00:03 +00:00
722395accd Update src/app/page.tsx 2026-04-22 14:00:03 +00:00
403fac2872 Update src/app/laptops/page.tsx 2026-04-22 14:00:03 +00:00
663b7221d9 Merge version_1 into main
Merge version_1 into main
2026-04-22 13:56:23 +00:00
5 changed files with 167 additions and 539 deletions

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

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

View File

@@ -2,12 +2,11 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
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 NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
export default function LandingPage() {
export default function ProductsPage() {
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
@@ -25,98 +24,29 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Laptops",
id: "/laptops",
},
{
name: "Pricing",
id: "/pricing",
},
{ name: "Home", id: "/" },
{ name: "Laptops", id: "/laptops" },
{ name: "Pricing", id: "/pricing" },
]}
brandName="TechLaptops"
button={{
text: "Contact Us",
href: "/contact",
}}
text: "Contact Us", href: "/contact"}}
/>
</div>
<div id="product-list" data-section="product-list">
<ProductCardOne
<ProductCardFour
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
title="Computers & Laptops"
description="Browse our comprehensive collection of computing devices for every need."
products={[
{
id: "p1",
name: "Pro Workstation",
price: "$1299",
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",
},
{ 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: "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" },
{ id: "p3", name: "Slim Ultrabook", price: "$999", variant: "Portable", imageSrc: "http://img.b2bpic.net/free-photo/laptop-marble-table_53876-63465.jpg?_wi=2" },
{ 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" },
]}
/>
</div>
@@ -124,32 +54,8 @@ export default function LandingPage() {
<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",
},
],
},
{ 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."
@@ -158,4 +64,4 @@ export default function LandingPage() {
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -28,291 +28,34 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Laptops",
id: "/laptops",
},
{
name: "Pricing",
id: "/pricing",
},
{ name: "Home", id: "/" },
{ name: "Computers", id: "/computer-types" },
{ name: "Pricing", id: "/pricing" },
]}
brandName="TechLaptops"
button={{
text: "Contact Us",
href: "/contact",
}}
button={{ text: "Contact Us", href: "/contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitTestimonial
background={{
variant: "gradient-bars",
}}
background={{ variant: "gradient-bars" }}
title="Unleash Your Productivity"
description="Premium laptops designed for modern professionals and creators. Find your perfect machine today."
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: "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",
},
{ 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: "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" },
]}
imageSrc="http://img.b2bpic.net/free-photo/still-life-device-table_23-2150994381.jpg?_wi=2"
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 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",
},
],
},
{ title: "Product", items: [{ label: "Computers", href: "/computer-types" }, { label: "Support", href: "#" }] },
{ title: "Company", items: [{ label: "About", href: "#" }, { label: "Pricing", href: "/pricing" }] },
]}
bottomLeftText="© 2024 TechLaptops"
bottomRightText="All rights reserved."
@@ -321,4 +64,4 @@ export default function LandingPage() {
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -2,12 +2,10 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
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 PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
export default function LandingPage() {
export default function PricingPage() {
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
@@ -22,164 +20,27 @@ export default function LandingPage() {
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Laptops",
id: "/laptops",
},
{
name: "Pricing",
id: "/pricing",
},
]}
brandName="TechLaptops"
button={{
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>
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "Computers", id: "/computer-types" },
{ name: "Pricing", id: "/pricing" },
]}
brandName="TechLaptops"
button={{ text: "Contact Us", href: "/contact" }}
/>
<PricingCardEight
title="Choose Your Plan"
description="Find the perfect solution for your needs."
animationType="slide-up"
useInvertedBackground={false}
textboxLayout="default"
plans={[
{ id: "basic", badge: "Starter", price: "$999", subtitle: "Essential performance", buttons: [{ text: "Buy Now", href: "#" }], features: ["Core i5", "8GB RAM", "256GB SSD"] },
{ id: "pro", badge: "Professional", price: "$1,599", subtitle: "Maximum productivity", buttons: [{ text: "Buy Now", href: "#" }], features: ["Core i7", "16GB RAM", "512GB SSD"] },
]}
/>
</ReactLenis>
</ThemeProvider>
);
}
}