Merge version_3_1781767700905 into main #2
@@ -5,15 +5,15 @@
|
||||
|
||||
:root {
|
||||
/* @colorThemes/lightTheme/grayNavyBlue */
|
||||
--background: #f5faff;
|
||||
--card: #ffffff;
|
||||
--foreground: #001122;
|
||||
--primary-cta: #15479c;
|
||||
--primary-cta-text: #f5faff;
|
||||
--secondary-cta: #ffffff;
|
||||
--secondary-cta-text: #001122;
|
||||
--accent: #a8cce8;
|
||||
--background-accent: #7ba3cf;
|
||||
--background: #0a0a0a;
|
||||
--card: #141414;
|
||||
--foreground: #fdfbf7;
|
||||
--primary-cta: #721c24;
|
||||
--primary-cta-text: #fdfbf7;
|
||||
--secondary-cta: #4a148c;
|
||||
--secondary-cta-text: #fdfbf7;
|
||||
--accent: #4a148c;
|
||||
--background-accent: #721c24;
|
||||
|
||||
/* @layout/border-radius/rounded */
|
||||
--radius: 1rem;
|
||||
|
||||
@@ -1,160 +1,33 @@
|
||||
import AboutFeaturesSplit from '@/components/sections/about/AboutFeaturesSplit';
|
||||
import ContactCta from '@/components/sections/contact/ContactCta';
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import FeaturesBento from '@/components/sections/features/FeaturesBento';
|
||||
import HeroCenteredLogos from '@/components/sections/hero/HeroCenteredLogos';
|
||||
import MetricsFeatureCards from '@/components/sections/metrics/MetricsFeatureCards';
|
||||
import TestimonialQuoteCards from '@/components/sections/testimonial/TestimonialQuoteCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
// AUTO-GENERATED shell by per-section-migrate.
|
||||
// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
|
||||
// files directly. Non-block content (wrappers, non-inlinable sections) is
|
||||
// preserved inline; extracted section blocks become <XSection/> refs.
|
||||
|
||||
export default function HomePage() {
|
||||
import React from 'react';
|
||||
import HeroSection from './HomePage/sections/Hero';
|
||||
import AboutSection from './HomePage/sections/About';
|
||||
import MetricsSection from './HomePage/sections/Metrics';
|
||||
import FeaturesSection from './HomePage/sections/Features';
|
||||
import TestimonialsSection from './HomePage/sections/Testimonials';
|
||||
import FaqSection from './HomePage/sections/Faq';
|
||||
import ContactSection from './HomePage/sections/Contact';
|
||||
|
||||
export default function HomePage(): React.JSX.Element {
|
||||
return (
|
||||
<>
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroCenteredLogos
|
||||
avatarsSrc={[
|
||||
"http://img.b2bpic.net/free-photo/studio-portrait-elegant-black-american-male-dressed-suit-grey-vignette-background_613910-1540.jpg", "http://img.b2bpic.net/free-photo/medium-shot-model-posing-studio_23-2149042844.jpg", "http://img.b2bpic.net/free-photo/portrait-handsome-man-orange-background_23-2149020032.jpg", "http://img.b2bpic.net/free-photo/strong-powerful-african-american-man-black-suit-taking-selfie-holding-camera-with-hands_627829-1124.jpg"]}
|
||||
avatarText="Join our community of visionaries"
|
||||
title="Built Different."
|
||||
description="YungHondo is the pulse of the African diaspora. Music, culture, and entrepreneurship rooted in our journey and built for the future."
|
||||
primaryButton={{
|
||||
text: "Join the Movement", href: "#contact"}}
|
||||
secondaryButton={{
|
||||
text: "Learn Our Story", href: "#about"}}
|
||||
names={[
|
||||
"Lagos", "London", "Atlanta", "Nairobi", "Accra", "Toronto"]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-man-holding-bottle_23-2149213419.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<>
|
||||
<HeroSection />
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutFeaturesSplit
|
||||
tag="Our Philosophy"
|
||||
title="More Than Just Music"
|
||||
description="YungHondo represents the collective resilience of the diaspora. We bridge borders, defy industry standards, and empower the next generation of creative entrepreneurs."
|
||||
items={[
|
||||
{
|
||||
icon: "Globe", title: "Diaspora Focus", description: "Global reach connecting our roots to modern soundscapes."},
|
||||
{
|
||||
icon: "TrendingUp", title: "Entrepreneurial Spirit", description: "Building sustainable ecosystems for artists and creators."},
|
||||
{
|
||||
icon: "Users", title: "Community First", description: "Creating spaces for growth, collaboration, and shared success."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/glowing-digital-sphere-futuristic-environment_23-2152020906.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<AboutSection />
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<SectionErrorBoundary name="metrics">
|
||||
<MetricsFeatureCards
|
||||
tag="Our Impact"
|
||||
title="Data Behind the Movement"
|
||||
description="Measuring success through community engagement and cultural footprint."
|
||||
metrics={[
|
||||
{
|
||||
value: "120+", title: "Lives Empowered", features: [
|
||||
"Mentorship programs", "Creative workshops", "Artist grants"],
|
||||
},
|
||||
{
|
||||
value: "500K+", title: "Streams Globally", features: [
|
||||
"Pan-African reach", "Organic growth", "Authentic storytelling"],
|
||||
},
|
||||
{
|
||||
value: "15", title: "Cities Connected", features: [
|
||||
"Global diaspora hubs", "Community events", "Strategic partnerships"],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<MetricsSection />
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<SectionErrorBoundary name="features">
|
||||
<FeaturesBento
|
||||
tag="Core Pillars"
|
||||
title="Built for Impact"
|
||||
description="Our work is centered on key areas that push the culture forward."
|
||||
features={[
|
||||
{
|
||||
title: "Cultural Preservation", description: "Keeping the history alive through modern musical expression.", bentoComponent: "orbiting-icons", centerIcon: "Music", orbitIcons: ["Globe", "Heart", "Zap", "Shield"]
|
||||
},
|
||||
{
|
||||
title: "Mentorship", description: "Real-time guidance for the next generation of black innovators.", bentoComponent: "chat-marquee", aiIcon: "User", userIcon: "MessageSquare", exchanges: [
|
||||
{ userMessage: "How do I start?", aiResponse: "Start by defining your story." },
|
||||
{ userMessage: "Need resources.", aiResponse: "Our network is here for you." }
|
||||
],
|
||||
placeholder: "Ask our community..."
|
||||
},
|
||||
{
|
||||
title: "Growth Milestones", description: "Tracking the progress of our community members.", bentoComponent: "checklist-timeline", heading: "Project Progress", subheading: "Milestones achieved together.", checklistItems: [
|
||||
{ label: "Founding", detail: "Completed" },
|
||||
{ label: "Scaling", detail: "In Progress" },
|
||||
{ label: "Global Expansion", detail: "Upcoming" }
|
||||
],
|
||||
completedLabel: "Milestone Met"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<FeaturesSection />
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<TestimonialQuoteCards
|
||||
tag="Voices of the Community"
|
||||
title="Authentic Experiences"
|
||||
description="What our collaborators and community members are saying about YungHondo."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Kwame Osei", role: "Artist", quote: "YungHondo changed my perspective on independence. Truly built different.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-shaved-head-male-dressed-native-viking-s-costume_613910-12250.jpg"},
|
||||
{
|
||||
name: "Amara Diallo", role: "Entrepreneur", quote: "The resources and community mentorship are unmatched.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-black-man-wool-suit_613910-16027.jpg"},
|
||||
{
|
||||
name: "Jordan Smith", role: "Creative Director", quote: "Finally, a brand that stays true to the culture without compromise.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-handsome-male-with-curly-hair-dressed-jacket-eyeglasses_613910-567.jpg"},
|
||||
{
|
||||
name: "Elena Martinez", role: "Producer", quote: "YungHondo isn't just a label, it's a movement.", imageSrc: "http://img.b2bpic.net/free-photo/smiley-man-with-suit-posing-black-white-medium-shot_23-2149411400.jpg"},
|
||||
{
|
||||
name: "Samuel Adeyemi", role: "Mentor", quote: "Deeply committed to upliftment. We're building the future.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-redhead-hipster-male-dressed-casual-clothes-with-glasses-full-beard-standing-with-crossed-arms-studio-isolated-dark-background_613910-20093.jpg"},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<TestimonialsSection />
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<FaqSplitMedia
|
||||
tag="Common Questions"
|
||||
title="Frequently Asked"
|
||||
description="Clarifying our purpose and how you can join the culture."
|
||||
items={[
|
||||
{
|
||||
question: "What is YungHondo?", answer: "A music and culture house committed to amplifying the diaspora."},
|
||||
{
|
||||
question: "How can I collaborate?", answer: "Contact us through the form below with your project details."},
|
||||
{
|
||||
question: "Where are you based?", answer: "We operate globally with a strong base in London and Atlanta."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-collection-colourful-pencils_23-2148539120.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<FaqSection />
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Connect"
|
||||
text="Ready to work? Let's build something different."
|
||||
primaryButton={{
|
||||
text: "Contact Us", href: "mailto:hello@yunghondo.com"}}
|
||||
secondaryButton={{
|
||||
text: "Listen to our Sound", href: "#"}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<ContactSection />
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
29
src/pages/HomePage/sections/About.tsx
Normal file
29
src/pages/HomePage/sections/About.tsx
Normal file
@@ -0,0 +1,29 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "about" section.
|
||||
|
||||
import React from 'react';
|
||||
import AboutFeaturesSplit from '@/components/sections/about/AboutFeaturesSplit';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function AboutSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutFeaturesSplit
|
||||
tag="Our Philosophy"
|
||||
title="More Than Just Music"
|
||||
description="YungHondo represents the collective resilience of the diaspora. We bridge borders, defy industry standards, and empower the next generation of creative entrepreneurs."
|
||||
items={[
|
||||
{
|
||||
icon: "Globe", title: "Diaspora Focus", description: "Global reach connecting our roots to modern soundscapes."},
|
||||
{
|
||||
icon: "TrendingUp", title: "Entrepreneurial Spirit", description: "Building sustainable ecosystems for artists and creators."},
|
||||
{
|
||||
icon: "Users", title: "Community First", description: "Creating spaces for growth, collaboration, and shared success."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/glowing-digital-sphere-futuristic-environment_23-2152020906.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
23
src/pages/HomePage/sections/Contact.tsx
Normal file
23
src/pages/HomePage/sections/Contact.tsx
Normal file
@@ -0,0 +1,23 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "contact" section.
|
||||
|
||||
import React from 'react';
|
||||
import ContactCta from '@/components/sections/contact/ContactCta';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function ContactSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Connect"
|
||||
text="Ready to work? Let's build something different."
|
||||
primaryButton={{
|
||||
text: "Contact Us", href: "mailto:hello@yunghondo.com"}}
|
||||
secondaryButton={{
|
||||
text: "Listen to our Sound", href: "#"}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
29
src/pages/HomePage/sections/Faq.tsx
Normal file
29
src/pages/HomePage/sections/Faq.tsx
Normal file
@@ -0,0 +1,29 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "faq" section.
|
||||
|
||||
import React from 'react';
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function FaqSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<FaqSplitMedia
|
||||
tag="Common Questions"
|
||||
title="Frequently Asked"
|
||||
description="Clarifying our purpose and how you can join the culture."
|
||||
items={[
|
||||
{
|
||||
question: "What is YungHondo?", answer: "A music and culture house committed to amplifying the diaspora."},
|
||||
{
|
||||
question: "How can I collaborate?", answer: "Contact us through the form below with your project details."},
|
||||
{
|
||||
question: "Where are you based?", answer: "We operate globally with a strong base in London and Atlanta."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-collection-colourful-pencils_23-2148539120.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
40
src/pages/HomePage/sections/Features.tsx
Normal file
40
src/pages/HomePage/sections/Features.tsx
Normal file
@@ -0,0 +1,40 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "features" section.
|
||||
|
||||
import React from 'react';
|
||||
import FeaturesBento from '@/components/sections/features/FeaturesBento';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function FeaturesSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="features" data-section="features">
|
||||
<SectionErrorBoundary name="features">
|
||||
<FeaturesBento
|
||||
tag="Core Pillars"
|
||||
title="Built for Impact"
|
||||
description="Our work is centered on key areas that push the culture forward."
|
||||
features={[
|
||||
{
|
||||
title: "Cultural Preservation", description: "Keeping the history alive through modern musical expression.", bentoComponent: "orbiting-icons", centerIcon: "Music", orbitIcons: ["Globe", "Heart", "Zap", "Shield"]
|
||||
},
|
||||
{
|
||||
title: "Mentorship", description: "Real-time guidance for the next generation of black innovators.", bentoComponent: "chat-marquee", aiIcon: "User", userIcon: "MessageSquare", exchanges: [
|
||||
{ userMessage: "How do I start?", aiResponse: "Start by defining your story." },
|
||||
{ userMessage: "Need resources.", aiResponse: "Our network is here for you." }
|
||||
],
|
||||
placeholder: "Ask our community..."
|
||||
},
|
||||
{
|
||||
title: "Growth Milestones", description: "Tracking the progress of our community members.", bentoComponent: "checklist-timeline", heading: "Project Progress", subheading: "Milestones achieved together.", checklistItems: [
|
||||
{ label: "Founding", detail: "Completed" },
|
||||
{ label: "Scaling", detail: "In Progress" },
|
||||
{ label: "Global Expansion", detail: "Upcoming" }
|
||||
],
|
||||
completedLabel: "Milestone Met"
|
||||
}
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
108
src/pages/HomePage/sections/Hero.tsx
Normal file
108
src/pages/HomePage/sections/Hero.tsx
Normal file
@@ -0,0 +1,108 @@
|
||||
/* eslint-disable */
|
||||
// @ts-nocheck — generated by catalog-eject; runtime-correct but TS strict-mode false-positives on inlined catalog body
|
||||
import Button from "@/components/ui/Button";
|
||||
import HeroBackgroundSlot from "@/components/ui/HeroBackgroundSlot";
|
||||
import TextAnimation from "@/components/ui/TextAnimation";
|
||||
import ImageOrVideo from "@/components/ui/ImageOrVideo";
|
||||
import AvatarGroup from "@/components/ui/AvatarGroup";
|
||||
|
||||
const avatarsSrc = [
|
||||
"http://img.b2bpic.net/free-photo/studio-portrait-elegant-black-american-male-dressed-suit-grey-vignette-background_613910-1540.jpg",
|
||||
"http://img.b2bpic.net/free-photo/medium-shot-model-posing-studio_23-2149042844.jpg",
|
||||
"http://img.b2bpic.net/free-photo/portrait-handsome-man-orange-background_23-2149020032.jpg",
|
||||
"http://img.b2bpic.net/free-photo/strong-powerful-african-american-man-black-suit-taking-selfie-holding-camera-with-hands_627829-1124.jpg"
|
||||
];
|
||||
const primaryButton = {
|
||||
text: "Join the Movement",
|
||||
href: "#contact"
|
||||
};
|
||||
const secondaryButton = {
|
||||
text: "Learn Our Story",
|
||||
href: "#about"
|
||||
};
|
||||
const names = [
|
||||
"Lagos",
|
||||
"London",
|
||||
"Atlanta",
|
||||
"Nairobi",
|
||||
"Accra",
|
||||
"Toronto"
|
||||
];
|
||||
|
||||
type HeroCenteredLogosProps = {
|
||||
avatarsSrc: string[];
|
||||
avatarText: string;
|
||||
title: string;
|
||||
description: string;
|
||||
primaryButton: { text: string; href: string };
|
||||
secondaryButton: { text: string; href: string };
|
||||
names: string[];
|
||||
hideMedia?: boolean;
|
||||
} & ({ imageSrc: string; videoSrc?: never } | { videoSrc: string; imageSrc?: never });
|
||||
|
||||
const HeroInline = () => {
|
||||
return (
|
||||
<section aria-label="Hero section" className="relative h-svh flex flex-col mb-20">
|
||||
<HeroBackgroundSlot />
|
||||
{!undefined && (
|
||||
<div className="absolute inset-0 z-0">
|
||||
<ImageOrVideo imageSrc={"http://img.b2bpic.net/free-photo/medium-shot-man-holding-bottle_23-2149213419.jpg"} className="size-full object-cover" />
|
||||
<div className="absolute inset-0 bg-background/80" />
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="relative z-10 flex-1 flex items-center justify-center">
|
||||
<div className="flex flex-col items-center gap-3 pt-8 w-content-width mx-auto text-center">
|
||||
<AvatarGroup avatarsSrc={avatarsSrc} label={"Join our community of visionaries"} size="lg" />
|
||||
|
||||
<TextAnimation
|
||||
text={"YungHondo"}
|
||||
variant="slide-up"
|
||||
gradientText={true}
|
||||
tag="h1"
|
||||
className="md:max-w-8/10 text-7xl 2xl:text-8xl leading-[1.15] font-semibold text-center text-balance"
|
||||
/>
|
||||
|
||||
<TextAnimation
|
||||
text={"Built Different."}
|
||||
variant="slide-up"
|
||||
gradientText={false}
|
||||
tag="h2"
|
||||
className="text-3xl md:text-5xl font-bold text-[#721c24] mt-2 tracking-tight uppercase"
|
||||
/>
|
||||
|
||||
<TextAnimation
|
||||
text={"Representing those who left home to build a future."}
|
||||
variant="slide-up"
|
||||
gradientText={false}
|
||||
tag="p"
|
||||
className="md:max-w-7/10 text-lg md:text-xl leading-snug text-balance"
|
||||
/>
|
||||
|
||||
<div className="flex flex-wrap justify-center gap-3 mt-2 md:mt-3">
|
||||
<Button text={"Listen Now"} href={"https://spotify.com"} variant="primary" />
|
||||
<Button text={"Watch Now"} href={"https://youtube.com"} variant="secondary" animationDelay={0.1} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="relative z-10 w-content-width mx-auto pb-8 overflow-hidden mask-fade-x">
|
||||
<div className="flex w-max animate-marquee-horizontal" style={{ animationDuration: "30s" }}>
|
||||
{[...names, ...names, ...names, ...names].map((name, index) => (
|
||||
<div key={index} className="shrink-0 mx-3 px-4 py-2 card rounded">
|
||||
<span className="text-xl font-semibold whitespace-nowrap text-foreground/75">{name}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default function HeroSection() {
|
||||
return (
|
||||
<div data-webild-section="hero" id="hero">
|
||||
<HeroInline />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
34
src/pages/HomePage/sections/Metrics.tsx
Normal file
34
src/pages/HomePage/sections/Metrics.tsx
Normal file
@@ -0,0 +1,34 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "metrics" section.
|
||||
|
||||
import React from 'react';
|
||||
import MetricsFeatureCards from '@/components/sections/metrics/MetricsFeatureCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function MetricsSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="metrics" data-section="metrics">
|
||||
<SectionErrorBoundary name="metrics">
|
||||
<MetricsFeatureCards
|
||||
tag="Our Impact"
|
||||
title="Data Behind the Movement"
|
||||
description="Measuring success through community engagement and cultural footprint."
|
||||
metrics={[
|
||||
{
|
||||
value: "120+", title: "Lives Empowered", features: [
|
||||
"Mentorship programs", "Creative workshops", "Artist grants"],
|
||||
},
|
||||
{
|
||||
value: "500K+", title: "Streams Globally", features: [
|
||||
"Pan-African reach", "Organic growth", "Authentic storytelling"],
|
||||
},
|
||||
{
|
||||
value: "15", title: "Cities Connected", features: [
|
||||
"Global diaspora hubs", "Community events", "Strategic partnerships"],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
32
src/pages/HomePage/sections/Testimonials.tsx
Normal file
32
src/pages/HomePage/sections/Testimonials.tsx
Normal file
@@ -0,0 +1,32 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "testimonials" section.
|
||||
|
||||
import React from 'react';
|
||||
import TestimonialQuoteCards from '@/components/sections/testimonial/TestimonialQuoteCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function TestimonialsSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<TestimonialQuoteCards
|
||||
tag="Voices of the Community"
|
||||
title="Authentic Experiences"
|
||||
description="What our collaborators and community members are saying about YungHondo."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Kwame Osei", role: "Artist", quote: "YungHondo changed my perspective on independence. Truly built different.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-shaved-head-male-dressed-native-viking-s-costume_613910-12250.jpg"},
|
||||
{
|
||||
name: "Amara Diallo", role: "Entrepreneur", quote: "The resources and community mentorship are unmatched.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-black-man-wool-suit_613910-16027.jpg"},
|
||||
{
|
||||
name: "Jordan Smith", role: "Creative Director", quote: "Finally, a brand that stays true to the culture without compromise.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-handsome-male-with-curly-hair-dressed-jacket-eyeglasses_613910-567.jpg"},
|
||||
{
|
||||
name: "Elena Martinez", role: "Producer", quote: "YungHondo isn't just a label, it's a movement.", imageSrc: "http://img.b2bpic.net/free-photo/smiley-man-with-suit-posing-black-white-medium-shot_23-2149411400.jpg"},
|
||||
{
|
||||
name: "Samuel Adeyemi", role: "Mentor", quote: "Deeply committed to upliftment. We're building the future.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-redhead-hipster-male-dressed-casual-clothes-with-glasses-full-beard-standing-with-crossed-arms-studio-isolated-dark-background_613910-20093.jpg"},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user