Merge version_2_1781705606138 into main #1
@@ -5,15 +5,15 @@
|
||||
|
||||
:root {
|
||||
/* @colorThemes/lightTheme/grayNavyBlue */
|
||||
--background: #050012;
|
||||
--card: #040121;
|
||||
--foreground: #f0e6ff;
|
||||
--primary-cta: #c89bff;
|
||||
--primary-cta-text: #050012;
|
||||
--secondary-cta: #1d123b;
|
||||
--secondary-cta-text: #f0e6ff;
|
||||
--accent: #684f7b;
|
||||
--background-accent: #65417c;
|
||||
--background: #000000;
|
||||
--card: #050a15;
|
||||
--foreground: #e0f0ff;
|
||||
--primary-cta: #3b82f6;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #1e3a8a;
|
||||
--secondary-cta-text: #bfdbfe;
|
||||
--accent: #2563eb;
|
||||
--background-accent: #172554;
|
||||
|
||||
/* @layout/border-radius/rounded */
|
||||
--radius: 0.5rem;
|
||||
|
||||
@@ -1,262 +1,36 @@
|
||||
import AboutFeaturesSplit from '@/components/sections/about/AboutFeaturesSplit';
|
||||
import ContactCta from '@/components/sections/contact/ContactCta';
|
||||
import FeaturesDetailedSteps from '@/components/sections/features/FeaturesDetailedSteps';
|
||||
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import MetricsSimpleCards from '@/components/sections/metrics/MetricsSimpleCards';
|
||||
import TeamOverlayCards from '@/components/sections/team/TeamOverlayCards';
|
||||
import TestimonialMarqueeOverlayCards from '@/components/sections/testimonial/TestimonialMarqueeOverlayCards';
|
||||
import { Layers, Shield, Zap } from "lucide-react";
|
||||
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 ServicesSection from './HomePage/sections/Services';
|
||||
import WorkSection from './HomePage/sections/Work';
|
||||
import MetricsSection from './HomePage/sections/Metrics';
|
||||
import TeamSection from './HomePage/sections/Team';
|
||||
import TestimonialsSection from './HomePage/sections/Testimonials';
|
||||
import ContactSection from './HomePage/sections/Contact';
|
||||
|
||||
export default function HomePage(): React.JSX.Element {
|
||||
return (
|
||||
<>
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroBillboard
|
||||
tag="Motion Design Agency"
|
||||
title="We bring your ideas to life with motion."
|
||||
description="Transforming brands into visual experiences through high-impact motion design and animation."
|
||||
primaryButton={{
|
||||
text: "Our Work",
|
||||
href: "#work",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Contact Us",
|
||||
href: "#contact",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/aesthetic-background-with-gradient-neon-led-light-effect_53876-108139.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<>
|
||||
<HeroSection />
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutFeaturesSplit
|
||||
tag="Our Philosophy"
|
||||
title="Crafting Stories in Motion"
|
||||
description="We blend technical precision with artistic freedom to create animations that resonate."
|
||||
items={[
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Rapid Prototyping",
|
||||
description: "Quick turnarounds for all your creative needs.",
|
||||
},
|
||||
{
|
||||
icon: Layers,
|
||||
title: "Visual Storytelling",
|
||||
description: "Every frame is meticulously crafted to tell your story.",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Reliable Quality",
|
||||
description: "Consistent high-quality deliverables that impress.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/code-testing-quality-assurance-done-computers-startup-workplace_482257-118649.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<AboutSection />
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<SectionErrorBoundary name="services">
|
||||
<FeaturesDetailedSteps
|
||||
tag="Our Workflow"
|
||||
title="Streamlined Creative Process"
|
||||
description="From concept to final render, our process ensures seamless delivery."
|
||||
steps={[
|
||||
{
|
||||
tag: "Discovery",
|
||||
title: "Conceptualization",
|
||||
subtitle: "Defining the vision",
|
||||
description: "We dive deep into your brand identity to build a solid narrative.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/digital-art-style-fashion-design-sketch-paper_23-2151487057.jpg",
|
||||
},
|
||||
{
|
||||
tag: "Production",
|
||||
title: "Animation Development",
|
||||
subtitle: "Building the motion",
|
||||
description: "Translating vision into fluid 2D and 3D motion elements.",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/gradient-colorful-sliders-collection_23-2149203800.jpg",
|
||||
},
|
||||
{
|
||||
tag: "Delivery",
|
||||
title: "Final Rendering",
|
||||
subtitle: "Polishing every frame",
|
||||
description: "Final color grading and delivery in your required formats.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-3d-train-model-with-simple-colored-background_23-2151157134.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<ServicesSection />
|
||||
|
||||
<div id="work" data-section="work">
|
||||
<SectionErrorBoundary name="work">
|
||||
<FeaturesImageBento
|
||||
tag="Featured Projects"
|
||||
title="Works that Move"
|
||||
description="Explore our portfolio of high-impact motion projects."
|
||||
items={[
|
||||
{
|
||||
title: "Abstract Waves",
|
||||
description: "Creative visual exploration.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-101266.jpg",
|
||||
},
|
||||
{
|
||||
title: "Liquid Energy",
|
||||
description: "Fluid animation branding.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/nail-polish-texture-macro_23-2148110968.jpg",
|
||||
},
|
||||
{
|
||||
title: "Bold Kinetic",
|
||||
description: "Impactful typographic motion.",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/retro-vintage-text-effect-editable-70s-80s-text-style_314614-4214.jpg",
|
||||
},
|
||||
{
|
||||
title: "Digital Pulse",
|
||||
description: "Tech-forward data visual.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-modern-background-with-abstract-flow-design_1048-12197.jpg",
|
||||
},
|
||||
{
|
||||
title: "Cyber Flow",
|
||||
description: "High-energy graphic motion.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/neon-hologram-tiger_23-2151558629.jpg",
|
||||
},
|
||||
{
|
||||
title: "Minimal Identity",
|
||||
description: "Clean logo motion.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/long-view-blue-abstract-design-made-from-paper_23-2148319039.jpg",
|
||||
},
|
||||
{
|
||||
title: "Organic Growth",
|
||||
description: "Natural movement study.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-103146.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<WorkSection />
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<SectionErrorBoundary name="metrics">
|
||||
<MetricsSimpleCards
|
||||
tag="Our Impact"
|
||||
title="Numbers That Speak"
|
||||
description="We take pride in our measurable creative impact."
|
||||
metrics={[
|
||||
{
|
||||
value: "150+",
|
||||
description: "Projects completed",
|
||||
},
|
||||
{
|
||||
value: "98%",
|
||||
description: "Client satisfaction rate",
|
||||
},
|
||||
{
|
||||
value: "50+",
|
||||
description: "Global brands supported",
|
||||
},
|
||||
{
|
||||
value: "1.2M",
|
||||
description: "Total frames animated",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<MetricsSection />
|
||||
|
||||
<div id="team" data-section="team">
|
||||
<SectionErrorBoundary name="team">
|
||||
<TeamOverlayCards
|
||||
tag="The Creatives"
|
||||
title="Meet Our Team"
|
||||
description="A diverse collective of motion artists and technical wizards."
|
||||
members={[
|
||||
{
|
||||
name: "Alex Rivet",
|
||||
role: "Creative Director",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-bearded-man-with-ear-bandage-art-studio_23-2149705903.jpg",
|
||||
},
|
||||
{
|
||||
name: "Jordan Flux",
|
||||
role: "Senior Animator",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-girl-with-pink-hairs-looks-positive_114579-14804.jpg",
|
||||
},
|
||||
{
|
||||
name: "Maya Form",
|
||||
role: "3D Designer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-female-painter-sitting-chair-art-studio-keeping-hands-pockets-her-shirt-smiling-gently-while-resting-after-drawing-picture-with-watercolors-people-hobby-painting-concept_273609-907.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<TeamSection />
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<TestimonialMarqueeOverlayCards
|
||||
tag="Social Proof"
|
||||
title="Trusted by Visionaries"
|
||||
description="Client feedback on our creative impact."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Sarah P.",
|
||||
role: "Marketing Lead",
|
||||
company: "TechStream",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-positive-executive-work_1098-519.jpg",
|
||||
},
|
||||
{
|
||||
name: "David W.",
|
||||
role: "Founder",
|
||||
company: "GrowthBox",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-businesswomen-relaxing-cafe_53876-30774.jpg",
|
||||
},
|
||||
{
|
||||
name: "Elena R.",
|
||||
role: "Art Director",
|
||||
company: "DesignCo",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67156.jpg",
|
||||
},
|
||||
{
|
||||
name: "Mark L.",
|
||||
role: "CEO",
|
||||
company: "NextGen",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-stylish-bearded-man-with-hairstyle-elegant-retro-gray-suit-bow-tie-posing-studio-isolated-gray-background_613910-20001.jpg",
|
||||
},
|
||||
{
|
||||
name: "Jane D.",
|
||||
role: "Brand Manager",
|
||||
company: "VisionAir",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/colleagues-working-together-project_23-2149286148.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<TestimonialsSection />
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Let's Connect"
|
||||
text="Ready to bring your vision to life? Let's discuss your next project."
|
||||
primaryButton={{
|
||||
text: "Get Started",
|
||||
href: "#",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "View Portfolio",
|
||||
href: "#work",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<ContactSection />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
39
src/pages/HomePage/sections/About.tsx
Normal file
39
src/pages/HomePage/sections/About.tsx
Normal file
@@ -0,0 +1,39 @@
|
||||
// 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 { Layers, Shield, Zap } from "lucide-react";
|
||||
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="Crafting Stories in Motion"
|
||||
description="We blend technical precision with artistic freedom to create animations that resonate."
|
||||
items={[
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Rapid Prototyping",
|
||||
description: "Quick turnarounds for all your creative needs.",
|
||||
},
|
||||
{
|
||||
icon: Layers,
|
||||
title: "Visual Storytelling",
|
||||
description: "Every frame is meticulously crafted to tell your story.",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Reliable Quality",
|
||||
description: "Consistent high-quality deliverables that impress.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/code-testing-quality-assurance-done-computers-startup-workplace_482257-118649.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
27
src/pages/HomePage/sections/Contact.tsx
Normal file
27
src/pages/HomePage/sections/Contact.tsx
Normal file
@@ -0,0 +1,27 @@
|
||||
// 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="Let's Connect"
|
||||
text="Ready to bring your vision to life? Let's discuss your next project."
|
||||
primaryButton={{
|
||||
text: "Get Started",
|
||||
href: "#",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "View Portfolio",
|
||||
href: "#work",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
29
src/pages/HomePage/sections/Hero.tsx
Normal file
29
src/pages/HomePage/sections/Hero.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 "hero" section.
|
||||
|
||||
import React from 'react';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function HeroSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroBillboard
|
||||
tag="Motion Design Agency"
|
||||
title="We bring your ideas to life with motion."
|
||||
description="Transforming brands into visual experiences through high-impact motion design and animation."
|
||||
primaryButton={{
|
||||
text: "Our Work",
|
||||
href: "#work",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Contact Us",
|
||||
href: "#contact",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/aesthetic-background-with-gradient-neon-led-light-effect_53876-108139.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
38
src/pages/HomePage/sections/Metrics.tsx
Normal file
38
src/pages/HomePage/sections/Metrics.tsx
Normal file
@@ -0,0 +1,38 @@
|
||||
// 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 MetricsSimpleCards from '@/components/sections/metrics/MetricsSimpleCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function MetricsSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="metrics" data-section="metrics">
|
||||
<SectionErrorBoundary name="metrics">
|
||||
<MetricsSimpleCards
|
||||
tag="Our Impact"
|
||||
title="Numbers That Speak"
|
||||
description="We take pride in our measurable creative impact."
|
||||
metrics={[
|
||||
{
|
||||
value: "150+",
|
||||
description: "Projects completed",
|
||||
},
|
||||
{
|
||||
value: "98%",
|
||||
description: "Client satisfaction rate",
|
||||
},
|
||||
{
|
||||
value: "50+",
|
||||
description: "Global brands supported",
|
||||
},
|
||||
{
|
||||
value: "1.2M",
|
||||
description: "Total frames animated",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
43
src/pages/HomePage/sections/Services.tsx
Normal file
43
src/pages/HomePage/sections/Services.tsx
Normal file
@@ -0,0 +1,43 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "services" section.
|
||||
|
||||
import React from 'react';
|
||||
import FeaturesDetailedSteps from '@/components/sections/features/FeaturesDetailedSteps';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function ServicesSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="services" data-section="services">
|
||||
<SectionErrorBoundary name="services">
|
||||
<FeaturesDetailedSteps
|
||||
tag="Our Workflow"
|
||||
title="Streamlined Creative Process"
|
||||
description="From concept to final render, our process ensures seamless delivery."
|
||||
steps={[
|
||||
{
|
||||
tag: "Discovery",
|
||||
title: "Conceptualization",
|
||||
subtitle: "Defining the vision",
|
||||
description: "We dive deep into your brand identity to build a solid narrative.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/digital-art-style-fashion-design-sketch-paper_23-2151487057.jpg",
|
||||
},
|
||||
{
|
||||
tag: "Production",
|
||||
title: "Animation Development",
|
||||
subtitle: "Building the motion",
|
||||
description: "Translating vision into fluid 2D and 3D motion elements.",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/gradient-colorful-sliders-collection_23-2149203800.jpg",
|
||||
},
|
||||
{
|
||||
tag: "Delivery",
|
||||
title: "Final Rendering",
|
||||
subtitle: "Polishing every frame",
|
||||
description: "Final color grading and delivery in your required formats.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-3d-train-model-with-simple-colored-background_23-2151157134.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
37
src/pages/HomePage/sections/Team.tsx
Normal file
37
src/pages/HomePage/sections/Team.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "team" section.
|
||||
|
||||
import React from 'react';
|
||||
import TeamOverlayCards from '@/components/sections/team/TeamOverlayCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function TeamSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="team" data-section="team">
|
||||
<SectionErrorBoundary name="team">
|
||||
<TeamOverlayCards
|
||||
tag="The Creatives"
|
||||
title="Meet Our Team"
|
||||
description="A diverse collective of motion artists and technical wizards."
|
||||
members={[
|
||||
{
|
||||
name: "Alex Rivet",
|
||||
role: "Creative Director",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-bearded-man-with-ear-bandage-art-studio_23-2149705903.jpg",
|
||||
},
|
||||
{
|
||||
name: "Jordan Flux",
|
||||
role: "Senior Animator",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-girl-with-pink-hairs-looks-positive_114579-14804.jpg",
|
||||
},
|
||||
{
|
||||
name: "Maya Form",
|
||||
role: "3D Designer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-female-painter-sitting-chair-art-studio-keeping-hands-pockets-her-shirt-smiling-gently-while-resting-after-drawing-picture-with-watercolors-people-hobby-painting-concept_273609-907.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
57
src/pages/HomePage/sections/Testimonials.tsx
Normal file
57
src/pages/HomePage/sections/Testimonials.tsx
Normal file
@@ -0,0 +1,57 @@
|
||||
// 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 TestimonialMarqueeOverlayCards from '@/components/sections/testimonial/TestimonialMarqueeOverlayCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function TestimonialsSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<TestimonialMarqueeOverlayCards
|
||||
tag="Social Proof"
|
||||
title="Trusted by Visionaries"
|
||||
description="Client feedback on our creative impact."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Sarah P.",
|
||||
role: "Marketing Lead",
|
||||
company: "TechStream",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-positive-executive-work_1098-519.jpg",
|
||||
},
|
||||
{
|
||||
name: "David W.",
|
||||
role: "Founder",
|
||||
company: "GrowthBox",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-businesswomen-relaxing-cafe_53876-30774.jpg",
|
||||
},
|
||||
{
|
||||
name: "Elena R.",
|
||||
role: "Art Director",
|
||||
company: "DesignCo",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67156.jpg",
|
||||
},
|
||||
{
|
||||
name: "Mark L.",
|
||||
role: "CEO",
|
||||
company: "NextGen",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-stylish-bearded-man-with-hairstyle-elegant-retro-gray-suit-bow-tie-posing-studio-isolated-gray-background_613910-20001.jpg",
|
||||
},
|
||||
{
|
||||
name: "Jane D.",
|
||||
role: "Brand Manager",
|
||||
company: "VisionAir",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/colleagues-working-together-project_23-2149286148.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
57
src/pages/HomePage/sections/Work.tsx
Normal file
57
src/pages/HomePage/sections/Work.tsx
Normal file
@@ -0,0 +1,57 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "work" section.
|
||||
|
||||
import React from 'react';
|
||||
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function WorkSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="work" data-section="work">
|
||||
<SectionErrorBoundary name="work">
|
||||
<FeaturesImageBento
|
||||
tag="Featured Projects"
|
||||
title="Works that Move"
|
||||
description="Explore our portfolio of high-impact motion projects."
|
||||
items={[
|
||||
{
|
||||
title: "Abstract Waves",
|
||||
description: "Creative visual exploration.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-101266.jpg",
|
||||
},
|
||||
{
|
||||
title: "Liquid Energy",
|
||||
description: "Fluid animation branding.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/nail-polish-texture-macro_23-2148110968.jpg",
|
||||
},
|
||||
{
|
||||
title: "Bold Kinetic",
|
||||
description: "Impactful typographic motion.",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/retro-vintage-text-effect-editable-70s-80s-text-style_314614-4214.jpg",
|
||||
},
|
||||
{
|
||||
title: "Digital Pulse",
|
||||
description: "Tech-forward data visual.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-modern-background-with-abstract-flow-design_1048-12197.jpg",
|
||||
},
|
||||
{
|
||||
title: "Cyber Flow",
|
||||
description: "High-energy graphic motion.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/neon-hologram-tiger_23-2151558629.jpg",
|
||||
},
|
||||
{
|
||||
title: "Minimal Identity",
|
||||
description: "Clean logo motion.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/long-view-blue-abstract-design-made-from-paper_23-2148319039.jpg",
|
||||
},
|
||||
{
|
||||
title: "Organic Growth",
|
||||
description: "Natural movement study.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/liquid-marbling-paint-texture-background-fluid-painting-abstract-texture-intensive-color-mix-wallpaper_1258-103146.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user