Merge version_1 into main #1
440
src/app/page.tsx
440
src/app/page.tsx
@@ -19,327 +19,145 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Work",
|
||||
id: "work",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Pegah Taheri"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Work", id: "work" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Pegah Taheri"
|
||||
button={{ text: "Get in touch", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{
|
||||
variant: "rotated-rays-static",
|
||||
}}
|
||||
title="Pegah Taheri"
|
||||
description="Multidisciplinary Designer working across Product, Branding, and Marketing."
|
||||
buttons={[
|
||||
{
|
||||
text: "View Resume",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
carouselItems={[
|
||||
{
|
||||
id: "1",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-woman-outdoor_624325-641.jpg",
|
||||
imageAlt: "Pegah Design Hero 1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-delicious-high-protein-vegan-meal_23-2149091303.jpg",
|
||||
imageAlt: "Pegah Design Hero 2",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/soft-concrete-texture_1194-8835.jpg",
|
||||
imageAlt: "Pegah Design Hero 3",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/white-sculptural-chair-futuristic-curved-interior_1194-640230.jpg",
|
||||
imageAlt: "Pegah Design Hero 4",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/composition-workplace-with-vase-laptop-desk_23-2148225531.jpg",
|
||||
imageAlt: "Pegah Design Hero 5",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gradient-blue-abstract-background-smooth-dark-blue-with-black-vignette-studio_1258-68106.jpg",
|
||||
imageAlt: "Pegah Design Hero 6",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{ variant: "rotated-rays-static" }}
|
||||
title="Pegah Taheri"
|
||||
description="Multidisciplinary Designer working across Product, Branding, and Marketing."
|
||||
buttons={[{ text: "View Resume", href: "#" }]}
|
||||
carouselItems={[
|
||||
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-woman-outdoor_624325-641.jpg", imageAlt: "Pegah Design Hero 1" },
|
||||
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/close-up-delicious-high-protein-vegan-meal_23-2149091303.jpg", imageAlt: "Pegah Design Hero 2" },
|
||||
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/soft-concrete-texture_1194-8835.jpg", imageAlt: "Pegah Design Hero 3" },
|
||||
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/white-sculptural-chair-futuristic-curved-interior_1194-640230.jpg", imageAlt: "Pegah Design Hero 4" },
|
||||
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/composition-workplace-with-vase-laptop-desk_23-2148225531.jpg", imageAlt: "Pegah Design Hero 5" },
|
||||
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/gradient-blue-abstract-background-smooth-dark-blue-with-black-vignette-studio_1258-68106.jpg", imageAlt: "Pegah Design Hero 6" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={false}
|
||||
heading={[
|
||||
{
|
||||
type: "text",
|
||||
content: "Hello! It's Pegah(/peh-GAH/) — from the Persian word پگاه.",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-sitting_23-2149213193.jpg",
|
||||
alt: "Pegah Taheri Portrait",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
content: "Former Visual Merchandiser @Cartier and @Louis Vuitton, with experience shaping brand experience in both physical and digital environments. Focused on clarity, consistency, and visual storytelling.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={false}
|
||||
heading={[
|
||||
{ type: "text", content: "Hello! It's Pegah(/peh-GAH/) — from the Persian word پگاه." },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-sitting_23-2149213193.jpg", alt: "Pegah Taheri Portrait" },
|
||||
{ type: "text", content: "Former Visual Merchandiser @Cartier and @Louis Vuitton, with experience shaping brand experience in both physical and digital environments. Focused on clarity, consistency, and visual storytelling." },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="work" data-section="work">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "w1",
|
||||
brand: "Tech",
|
||||
name: "YEGO App Redesign",
|
||||
price: "Retention Focus",
|
||||
rating: 5,
|
||||
reviewCount: "2023",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104482.jpg",
|
||||
},
|
||||
{
|
||||
id: "w2",
|
||||
brand: "Retail",
|
||||
name: "Luxury Concept",
|
||||
price: "Visual Identity",
|
||||
rating: 5,
|
||||
reviewCount: "2022",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/assemble-manufacturing-production-business-pattern_53876-133939.jpg",
|
||||
},
|
||||
{
|
||||
id: "w3",
|
||||
brand: "Design",
|
||||
name: "Brand Strategy",
|
||||
price: "Market Expansion",
|
||||
rating: 5,
|
||||
reviewCount: "2021",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blue-color-squares-arrangement-flat-lay_23-2149345127.jpg",
|
||||
},
|
||||
{
|
||||
id: "w4",
|
||||
brand: "UI/UX",
|
||||
name: "Safety Systems",
|
||||
price: "Feedback Loop",
|
||||
rating: 5,
|
||||
reviewCount: "2023",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104491.jpg",
|
||||
},
|
||||
{
|
||||
id: "w5",
|
||||
brand: "Fashion",
|
||||
name: "Store Concept",
|
||||
price: "Visual Merchandising",
|
||||
rating: 5,
|
||||
reviewCount: "2020",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/corporate-stationery-concept_23-2147786733.jpg",
|
||||
},
|
||||
{
|
||||
id: "w6",
|
||||
brand: "Digital",
|
||||
name: "User Experience",
|
||||
price: "Growth Data",
|
||||
rating: 5,
|
||||
reviewCount: "2023",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-laptop-with-rate-charts-display-while-man-woman-working-business-project-design-computer-screen-with-data-chart-information-finance-analysis-desk_482257-40065.jpg",
|
||||
},
|
||||
]}
|
||||
title="Selected Work"
|
||||
description="Projects spanning product, brand experience, and strategy."
|
||||
/>
|
||||
</div>
|
||||
<div id="work" data-section="work">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "w1", brand: "Tech", name: "YEGO App Redesign", price: "Retention Focus", rating: 5, reviewCount: "2023", imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104482.jpg" },
|
||||
{ id: "w2", brand: "Retail", name: "Luxury Concept", price: "Visual Identity", rating: 5, reviewCount: "2022", imageSrc: "http://img.b2bpic.net/free-photo/assemble-manufacturing-production-business-pattern_53876-133939.jpg" },
|
||||
{ id: "w3", brand: "Design", name: "Brand Strategy", price: "Market Expansion", rating: 5, reviewCount: "2021", imageSrc: "http://img.b2bpic.net/free-photo/blue-color-squares-arrangement-flat-lay_23-2149345127.jpg" },
|
||||
{ id: "w4", brand: "UI/UX", name: "Safety Systems", price: "Feedback Loop", rating: 5, reviewCount: "2023", imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150104491.jpg" },
|
||||
{ id: "w5", brand: "Fashion", name: "Store Concept", price: "Visual Merchandising", rating: 5, reviewCount: "2020", imageSrc: "http://img.b2bpic.net/free-photo/corporate-stationery-concept_23-2147786733.jpg" },
|
||||
{ id: "w6", brand: "Digital", name: "User Experience", price: "Growth Data", rating: 5, reviewCount: "2023", imageSrc: "http://img.b2bpic.net/free-photo/close-up-modern-laptop-with-rate-charts-display-while-man-woman-working-business-project-design-computer-screen-with-data-chart-information-finance-analysis-desk_482257-40065.jpg" },
|
||||
]}
|
||||
title="Selected Work"
|
||||
description="Projects spanning product, brand experience, and strategy."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Client A",
|
||||
role: "Product Lead",
|
||||
company: "TechCorp",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/middle-age-businessman-smiling-happy-standing-city_839833-25759.jpg",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Client B",
|
||||
role: "Creative Director",
|
||||
company: "Studio X",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/image-corporate-woman-working-office-sitting-front-laptop-preparing-business_1258-194628.jpg",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Client C",
|
||||
role: "Manager",
|
||||
company: "GrowthCo",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/asian-architect-woman_53876-31462.jpg",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Client D",
|
||||
role: "CEO",
|
||||
company: "StartUp Y",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-young-handsome-man-sitting-cafe-table_1262-975.jpg",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Client E",
|
||||
role: "Partner",
|
||||
company: "Agency Z",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-successful-middle-aged-business-leader_1262-5690.jpg",
|
||||
},
|
||||
]}
|
||||
title="What People Say"
|
||||
description="Kind words from clients and collaborators."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Client A", role: "Product Lead", company: "TechCorp", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/middle-age-businessman-smiling-happy-standing-city_839833-25759.jpg" },
|
||||
{ id: "t2", name: "Client B", role: "Creative Director", company: "Studio X", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/image-corporate-woman-working-office-sitting-front-laptop-preparing-business_1258-194628.jpg" },
|
||||
{ id: "t3", name: "Client C", role: "Manager", company: "GrowthCo", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/asian-architect-woman_53876-31462.jpg" },
|
||||
{ id: "t4", name: "Client D", role: "CEO", company: "StartUp Y", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-young-handsome-man-sitting-cafe-table_1262-975.jpg" },
|
||||
{ id: "t5", name: "Client E", role: "Partner", company: "Agency Z", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-successful-middle-aged-business-leader_1262-5690.jpg" },
|
||||
]}
|
||||
title="What People Say"
|
||||
description="Kind words from clients and collaborators."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "15%",
|
||||
title: "Retention",
|
||||
description: "Improved user retention through feedback loop design.",
|
||||
icon: CheckCircle,
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "2+",
|
||||
title: "Industry Leaders",
|
||||
description: "Experience at Cartier and Louis Vuitton.",
|
||||
icon: Award,
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "50+",
|
||||
title: "Projects",
|
||||
description: "Completed multidisciplinary projects successfully.",
|
||||
icon: Sparkles,
|
||||
},
|
||||
]}
|
||||
title="Key Achievements"
|
||||
description="Proven impact on product retention and visual storytelling."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", value: "15%", title: "Retention", description: "Improved user retention through feedback loop design.", icon: CheckCircle },
|
||||
{ id: "m2", value: "2+", title: "Industry Leaders", description: "Experience at Cartier and Louis Vuitton.", icon: Award },
|
||||
{ id: "m3", value: "50+", title: "Projects", description: "Completed multidisciplinary projects successfully.", icon: Sparkles },
|
||||
]}
|
||||
title="Key Achievements"
|
||||
description="Proven impact on product retention and visual storytelling."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "What is your core focus?",
|
||||
content: "I focus on clarity, consistency, and visual storytelling across product and branding.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "What tools do you use?",
|
||||
content: "I utilize a standard stack of design tools tailored for product and brand experience.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Are you taking new projects?",
|
||||
content: "I am open to discuss new opportunities that align with my expertise.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/minimalist-black-white-office-desk-with-stationery_9975-133066.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
title="Process & Approach"
|
||||
description="Common questions regarding my design journey and capabilities."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "f1", title: "What is your core focus?", content: "I focus on clarity, consistency, and visual storytelling across product and branding." },
|
||||
{ id: "f2", title: "What tools do you use?", content: "I utilize a standard stack of design tools tailored for product and brand experience." },
|
||||
{ id: "f3", title: "Are you taking new projects?", content: "I am open to discuss new opportunities that align with my expertise." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/minimalist-black-white-office-desk-with-stationery_9975-133066.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
title="Process & Approach"
|
||||
description="Common questions regarding my design journey and capabilities."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Contact"
|
||||
title="Get in touch"
|
||||
description="Let's discuss how we can work together."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Contact"
|
||||
title="Get in touch"
|
||||
description="Let's discuss how we can work together."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Projects",
|
||||
href: "#work",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "Resume",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="Pegah Taheri"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{ items: [{ label: "Projects", href: "#work" }, { label: "About", href: "#about" }] },
|
||||
{ items: [{ label: "Contact", href: "#contact" }, { label: "Resume", href: "#" }] },
|
||||
]}
|
||||
logoText="Pegah Taheri"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user