bender/b0e95f5f-29a6-412a-bfab-a3b2ebc6c8ee
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-05-09 12:57:24 +00:00
parent 072af86468
commit 67a8405852
1 changed files with 158 additions and 415 deletions
Download Patch File Download Diff File Expand all files Collapse all files

573
src/app/page.tsx
View File

@@ -17,432 +17,175 @@ import { PenTool, Search, Zap } from "lucide-react";
export default function LandingPage() { export default function LandingPage() {
return ( return (
<ThemeProvider <ThemeProvider
defaultButtonVariant="hover-bubble" defaultButtonVariant="hover-bubble"
defaultTextAnimation="reveal-blur" defaultTextAnimation="reveal-blur"
borderRadius="rounded" borderRadius="rounded"
contentWidth="mediumSmall" contentWidth="mediumSmall"
sizing="largeSizeMediumTitles" sizing="largeSizeMediumTitles"
background="floatingGradient" background="floatingGradient"
cardStyle="gradient-bordered" cardStyle="gradient-bordered"
primaryButtonStyle="diagonal-gradient" primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="glass" secondaryButtonStyle="glass"
headingFontWeight="light" headingFontWeight="light"
> >
<ReactLenis root> <ReactLenis root>
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarLayoutFloatingInline <NavbarLayoutFloatingInline
navItems={[ navItems={[
{ { name: "Home", id: "hero" },
name: "Home", { name: "Services", id: "features" },
id: "hero", { name: "Case Studies", id: "products" },
}, { name: "Process", id: "team" },
{ { name: "Contact", id: "contact" },
name: "Services", ]}
id: "features", brandName="Rayan Tarh"
}, button={{ text: "Get Started", href: "#contact" }}
{ />
name: "Case Studies", </div>
id: "products",
},
{
name: "Process",
id: "team",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Rayan Tarh"
button={{
text: "Get Started",
href: "#contact",
}}
/>
</div>
<div id="hero" data-section="hero"> <div id="hero" data-section="hero">
<HeroBillboard <HeroBillboard
background={{ background={{ variant: "gradient-bars" }}
variant: "gradient-bars", title="Architecting the Future of Digital Growth"
}} description="Rayan Tarh transforms brands through a fusion of high-end branding, SEO dominance, and performance-driven marketing strategy. We don't just build, we evolve."
title="Architecting the Future of Digital Growth" buttons={[
description="Rayan Tarh transforms brands through a fusion of high-end branding, SEO dominance, and performance-driven marketing strategy. We don't just build, we evolve." { text: "Explore Agency", href: "#features" },
buttons={[ { text: "Request Proposal", href: "#contact" },
{ ]}
text: "Explore Agency", imageSrc="http://img.b2bpic.net/free-photo/flat-lay-desktop-with-laptop-magnifier_23-2148430895.jpg"
href: "#features", imageAlt="futuristic tech background dark neon blue"
}, mediaAnimation="blur-reveal"
{ avatars={[
text: "Request Proposal", { src: "http://img.b2bpic.net/free-photo/high-angle-desktop-with-laptop-camera_23-2148430858.jpg", alt: "High angle of desktop with laptop and camera" },
href: "#contact", { src: "http://img.b2bpic.net/free-photo/top-view-desk-dark-concept-with-copy-space_23-2148459467.jpg", alt: "Top view of desk dark concept with copy space" },
}, { src: "http://img.b2bpic.net/free-photo/cup-tea-lamp-laptop-desktop-night_169016-17447.jpg", alt: "Cup of tea lamp and laptop on the desktop at night" },
]} { src: "http://img.b2bpic.net/free-photo/black-laptop-screen-dark-room-night_169016-59640.jpg", alt: "Black laptop screen in a dark room at night" },
imageSrc="http://img.b2bpic.net/free-photo/flat-lay-desktop-with-laptop-magnifier_23-2148430895.jpg?_wi=1" { src: "http://img.b2bpic.net/free-photo/workers-it-company-working-computer_1303-19431.jpg", alt: "Workers at an IT company working on a computer" },
imageAlt="futuristic tech background dark neon blue" ]}
mediaAnimation="blur-reveal" avatarText="Trusted by 150+ global brands"
avatars={[ marqueeItems={[
{ { type: "text", text: "Brand Evolution" },
src: "http://img.b2bpic.net/free-photo/high-angle-desktop-with-laptop-camera_23-2148430858.jpg", { type: "text", text: "SEO Dominance" },
alt: "High angle of desktop with laptop and camera", { type: "text", text: "Performance Marketing" },
}, { type: "text", text: "Digital Strategy" },
{ { type: "text", text: "Data Analytics" },
src: "http://img.b2bpic.net/free-photo/top-view-desk-dark-concept-with-copy-space_23-2148459467.jpg", ]}
alt: "Top view of desk dark concept with copy space", />
}, </div>
{
src: "http://img.b2bpic.net/free-photo/cup-tea-lamp-laptop-desktop-night_169016-17447.jpg",
alt: "Cup of tea lamp and laptop on the desktop at night",
},
{
src: "http://img.b2bpic.net/free-photo/black-laptop-screen-dark-room-night_169016-59640.jpg",
alt: "Black laptop screen in a dark room at night",
},
{
src: "http://img.b2bpic.net/free-photo/workers-it-company-working-computer_1303-19431.jpg",
alt: "Workers at an IT company working on a computer",
},
]}
avatarText="Trusted by 150+ global brands"
marqueeItems={[
{
type: "text",
text: "Brand Evolution",
},
{
type: "text",
text: "SEO Dominance",
},
{
type: "text",
text: "Performance Marketing",
},
{
type: "text",
text: "Digital Strategy",
},
{
type: "text",
text: "Data Analytics",
},
]}
/>
</div>
<div id="metrics" data-section="metrics"> <div id="metrics" data-section="metrics">
<MetricCardSeven <MetricCardSeven
animationType="depth-3d" animationType="depth-3d"
textboxLayout="split-description" textboxLayout="split-description"
useInvertedBackground={true} useInvertedBackground={true}
metrics={[ metrics={[
{ { id: "m1", value: "500%", title: "Average ROAS Increase", items: ["Strategic ad spend optimization", "High-frequency testing cycles", "Precision audience targeting"] },
id: "m1", { id: "m2", value: "150+", title: "Brands Scaled", items: ["End-to-end branding overhaul", "SEO visibility expansion", "Cross-platform consistency"] },
value: "500%", { id: "m3", value: "24/7", title: "Performance Monitoring", items: ["Real-time KPI tracking", "Automated anomaly detection", "Immediate strategic adjustments"] },
title: "Average ROAS Increase", ]}
items: [ title="Measurable Impact"
"Strategic ad spend optimization", description="Numbers define the success of our creative strategies. We deliver results that scale your business."
"High-frequency testing cycles", />
"Precision audience targeting", </div>
],
},
{
id: "m2",
value: "150+",
title: "Brands Scaled",
items: [
"End-to-end branding overhaul",
"SEO visibility expansion",
"Cross-platform consistency",
],
},
{
id: "m3",
value: "24/7",
title: "Performance Monitoring",
items: [
"Real-time KPI tracking",
"Automated anomaly detection",
"Immediate strategic adjustments",
],
},
]}
title="Measurable Impact"
description="Numbers define the success of our creative strategies. We deliver results that scale your business."
/>
</div>
<div id="features" data-section="features"> <div id="features" data-section="features">
<FeatureCardTwentyFive <FeatureCardTwentyFive
animationType="depth-3d" animationType="depth-3d"
textboxLayout="split" textboxLayout="split"
useInvertedBackground={false} useInvertedBackground={false}
features={[ features={[
{ { title: "High-End Branding", description: "Crafting unique visual identities that stand out in crowded digital landscapes.", icon: PenTool, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/3d-graph-computer-illustration_23-2151884878.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/3d-graph-computer-illustration_23-2151884874.jpg" }] },
title: "High-End Branding", { title: "Advanced SEO", description: "Dominating search rankings with ethical and data-driven optimization strategies.", icon: Search, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/3d-render-abstract-background-flowing-particles_1048-14872.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-futuristic-technologies_23-2151941513.jpg" }] },
description: "Crafting unique visual identities that stand out in crowded digital landscapes.", { title: "Performance Marketing", description: "Generating tangible growth through precision-targeted media campaigns.", icon: Zap, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/desktop-pc-wooden-desk-showcases-infographics-client-reach-data_482257-126876.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/desktop-pc-wooden-desk-showcases-infographics-client-reach-data_482257-126353.jpg" }] },
icon: PenTool, ]}
mediaItems: [ title="Our Specialized Agency Ecosystem"
{ description="A comprehensive suite of digital services designed for elite brand presence."
imageSrc: "http://img.b2bpic.net/free-photo/3d-graph-computer-illustration_23-2151884878.jpg", />
}, </div>
{
imageSrc: "http://img.b2bpic.net/free-photo/3d-graph-computer-illustration_23-2151884874.jpg",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-desktop-with-laptop-magnifier_23-2148430895.jpg?_wi=2",
imageAlt: "web design UI concept neon dark",
},
{
title: "Advanced SEO",
description: "Dominating search rankings with ethical and data-driven optimization strategies.",
icon: Search,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-abstract-background-flowing-particles_1048-14872.jpg",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-futuristic-technologies_23-2151941513.jpg",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businesswoman-holding-tablet_23-2148452667.jpg?_wi=1",
imageAlt: "web design UI concept neon dark",
},
{
title: "Performance Marketing",
description: "Generating tangible growth through precision-targeted media campaigns.",
icon: Zap,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/desktop-pc-wooden-desk-showcases-infographics-client-reach-data_482257-126876.jpg",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/desktop-pc-wooden-desk-showcases-infographics-client-reach-data_482257-126353.jpg",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/front-view-stack-blue-conserves_23-2148785252.jpg?_wi=1",
imageAlt: "web design UI concept neon dark",
},
]}
title="Our Specialized Agency Ecosystem"
description="A comprehensive suite of digital services designed for elite brand presence."
/>
</div>
<div id="products" data-section="products"> <div id="products" data-section="products">
<ProductCardFour <ProductCardFour
textboxLayout="split-description" animationType="slide-up"
gridVariant="one-large-right-three-stacked-left" textboxLayout="split-description"
useInvertedBackground={true} gridVariant="one-large-right-three-stacked-left"
products={[ useInvertedBackground={true}
{ products={[
id: "p1", { id: "p1", name: "LuxBrand Overhaul", price: "Strategic Branding", variant: "Fashion Retail", imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businesswoman-holding-tablet_23-2148452667.jpg" },
name: "LuxBrand Overhaul", { id: "p2", name: "TechApp Growth", price: "User Acquisition", variant: "SaaS Platform", imageSrc: "http://img.b2bpic.net/free-photo/front-view-stack-blue-conserves_23-2148785252.jpg" },
price: "Strategic Branding", { id: "p3", name: "EcoIdentity System", price: "Visual Identity", variant: "Sustainable", imageSrc: "http://img.b2bpic.net/free-vector/flat-design-business-stationery-template_23-2151158014.jpg" },
variant: "Fashion Retail", ]}
imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businesswoman-holding-tablet_23-2148452667.jpg?_wi=2", title="Featured Case Studies"
}, description="Examples of digital evolution and business growth."
{ />
id: "p2", </div>
name: "TechApp Growth",
price: "User Acquisition",
variant: "SaaS Platform",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-stack-blue-conserves_23-2148785252.jpg?_wi=2",
},
{
id: "p3",
name: "EcoIdentity System",
price: "Visual Identity",
variant: "Sustainable",
imageSrc: "http://img.b2bpic.net/free-vector/flat-design-business-stationery-template_23-2151158014.jpg",
},
{
id: "p4",
name: "Global SEO Scale",
price: "Visibility Growth",
variant: "E-Commerce",
imageSrc: "http://img.b2bpic.net/free-photo/laptop-with-graphs-statistics-glasses-table_169016-29673.jpg",
},
{
id: "p5",
name: "Agency Dashboard",
price: "Performance Tool",
variant: "Analytics",
imageSrc: "http://img.b2bpic.net/free-photo/man-analyzing-stock-market-charts-financial-data-electronic-board_169016-14896.jpg",
},
{
id: "p6",
name: "Experience Web",
price: "Design System",
variant: "Corporate",
imageSrc: "http://img.b2bpic.net/free-photo/man-with-vr-headset-touching-holographic-screen_53876-101150.jpg",
},
]}
title="Featured Case Studies"
description="Examples of digital evolution and business growth."
/>
</div>
<div id="testimonials" data-section="testimonials"> <div id="testimonials" data-section="testimonials">
<TestimonialCardOne <TestimonialCardOne
animationType="scale-rotate" animationType="scale-rotate"
textboxLayout="split-description" textboxLayout="split-description"
gridVariant="bento-grid" gridVariant="bento-grid"
useInvertedBackground={false} useInvertedBackground={false}
testimonials={[ testimonials={[
{ { id: "t1", name: "Alex Rivers", role: "CEO", company: "Lux Retail", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/professional-young-woman-posing-office_23-2148452650.jpg" },
id: "t1", { id: "t2", name: "Sarah Chen", role: "Director", company: "Appify", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-woman-designer-work_171337-15578.jpg" },
name: "Alex Rivers", { id: "t3", name: "Markus Thorne", role: "CMO", company: "Eco Corp", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-using-digital-device-home_23-2149105974.jpg" },
role: "CEO", { id: "t4", name: "Elena Rossi", role: "Founder", company: "DesignCo", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-camera-with-crossed-arms-happy-confident-satisfied-expression-lateral-view_1194-633413.jpg" },
company: "Lux Retail", { id: "t5", name: "Julian Vane", role: "VP Operations", company: "GrowthX", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-holding-tablet_23-2149005455.jpg" },
rating: 5, ]}
imageSrc: "http://img.b2bpic.net/free-photo/professional-young-woman-posing-office_23-2148452650.jpg", title="Client Success Stories"
}, description="What industry leaders say about our strategic impact."
{ />
id: "t2", </div>
name: "Sarah Chen",
role: "Director",
company: "Appify",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-woman-designer-work_171337-15578.jpg",
},
{
id: "t3",
name: "Markus Thorne",
role: "CMO",
company: "Eco Corp",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-using-digital-device-home_23-2149105974.jpg",
},
{
id: "t4",
name: "Elena Rossi",
role: "Founder",
company: "DesignCo",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-camera-with-crossed-arms-happy-confident-satisfied-expression-lateral-view_1194-633413.jpg",
},
{
id: "t5",
name: "Julian Vane",
role: "VP Operations",
company: "GrowthX",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-holding-tablet_23-2149005455.jpg",
},
]}
title="Client Success Stories"
description="What industry leaders say about our strategic impact."
/>
</div>
<div id="team" data-section="team"> <div id="team" data-section="team">
<TeamCardOne <TeamCardOne
animationType="depth-3d" animationType="depth-3d"
textboxLayout="split-description" textboxLayout="split-description"
gridVariant="three-columns-all-equal-width" gridVariant="three-columns-all-equal-width"
useInvertedBackground={true} useInvertedBackground={true}
members={[ members={[
{ { id: "team-1", name: "Liam Vance", role: "Creative Lead", imageSrc: "http://img.b2bpic.net/free-photo/redhead-female-supervisor-dressed-elegant-suit-grey-background_613910-10390.jpg" },
id: "team-1", { id: "team-2", name: "Jordan P", role: "Systems Engineer", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-typing-keyboard_23-2149101167.jpg" },
name: "Liam Vance", { id: "team-3", name: "Maya Singh", role: "Strategy Lead", imageSrc: "http://img.b2bpic.net/free-photo/ethereal-portrait-with-floral-transparency_23-2151998045.jpg" },
role: "Creative Lead", ]}
imageSrc: "http://img.b2bpic.net/free-photo/redhead-female-supervisor-dressed-elegant-suit-grey-background_613910-10390.jpg", title="Our Agency Visionaries"
}, description="The creative and analytical minds behind our growth strategies."
{ />
id: "team-2", </div>
name: "Jordan P",
role: "Systems Engineer",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-typing-keyboard_23-2149101167.jpg",
},
{
id: "team-3",
name: "Maya Singh",
role: "Strategy Lead",
imageSrc: "http://img.b2bpic.net/free-photo/ethereal-portrait-with-floral-transparency_23-2151998045.jpg",
},
]}
title="Our Agency Visionaries"
description="The creative and analytical minds behind our growth strategies."
/>
</div>
<div id="faq" data-section="faq"> <div id="faq" data-section="faq">
<FaqSplitText <FaqSplitText
useInvertedBackground={false} useInvertedBackground={false}
faqs={[ faqs={[
{ { id: "f1", title: "How do we get started?", content: "Book a discovery call so we can understand your business model." },
id: "f1", { id: "f2", title: "What is the typical timeline?", content: "Projects usually range from 4 to 12 weeks depending on scope." },
title: "How do we get started?", { id: "f3", title: "Do you offer long-term support?", content: "Yes, we have monthly performance marketing retainers available." },
content: "Book a discovery call so we can understand your business model.", ]}
}, sideTitle="Agency FAQ"
{ sideDescription="Common questions about working with Rayan Tarh."
id: "f2", faqsAnimation="blur-reveal"
title: "What is the typical timeline?", />
content: "Projects usually range from 4 to 12 weeks depending on scope.", </div>
},
{
id: "f3",
title: "Do you offer long-term support?",
content: "Yes, we have monthly performance marketing retainers available.",
},
]}
sideTitle="Agency FAQ"
sideDescription="Common questions about working with Rayan Tarh."
faqsAnimation="blur-reveal"
/>
</div>
<div id="contact" data-section="contact"> <div id="contact" data-section="contact">
<ContactCenter <ContactCenter
useInvertedBackground={true} useInvertedBackground={true}
background={{ background={{ variant: "sparkles-gradient" }}
variant: "sparkles-gradient", tag="Let's Talk"
}} title="Ready to Transform Your Brand?"
tag="Let's Talk" description="Drop us a line to discuss how Rayan Tarh can elevate your digital presence."
title="Ready to Transform Your Brand?" />
description="Drop us a line to discuss how Rayan Tarh can elevate your digital presence." </div>
/>
</div>
<div id="footer" data-section="footer"> <div id="footer" data-section="footer">
<FooterLogoEmphasis <FooterLogoEmphasis
columns={[ columns={[
{ { items: [{ label: "Services", href: "#features" }, { label: "Portfolio", href: "#products" }, { label: "About", href: "#team" }] },
items: [ { items: [{ label: "Contact", href: "#contact" }, { label: "Privacy Policy", href: "#" }, { label: "Terms", href: "#" }] },
{ ]}
label: "Services", logoText="Rayan Tarh"
href: "#features", />
}, </div>
{
label: "Portfolio",
href: "#products",
},
{
label: "About",
href: "#team",
},
],
},
{
items: [
{
label: "Contact",
href: "#contact",
},
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms",
href: "#",
},
],
},
]}
logoText="Rayan Tarh"
/>
</div>
</ReactLenis> </ReactLenis>
</ThemeProvider> </ThemeProvider>
); );