Merge version_2_1781768416341 into main #2
@@ -5,15 +5,15 @@
|
||||
|
||||
:root {
|
||||
/* @colorThemes/lightTheme/grayNavyBlue */
|
||||
--background: #fafffb;
|
||||
--card: #ffffff;
|
||||
--foreground: #001a0a;
|
||||
--primary-cta: #0a705f;
|
||||
--primary-cta-text: #fafffb;
|
||||
--secondary-cta: #ffffff;
|
||||
--secondary-cta-text: #001a0a;
|
||||
--accent: #a8d9be;
|
||||
--background-accent: #6bbfb8;
|
||||
--background: #0a0a0a;
|
||||
--card: #141414;
|
||||
--foreground: #ffffff;
|
||||
--primary-cta: #2563eb;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #1f2937;
|
||||
--secondary-cta-text: #ffffff;
|
||||
--accent: #3b82f6;
|
||||
--background-accent: #1e3a8a;
|
||||
|
||||
/* @layout/border-radius/rounded */
|
||||
--radius: 0.5rem;
|
||||
|
||||
@@ -1,286 +1,39 @@
|
||||
import AboutFeaturesSplit from '@/components/sections/about/AboutFeaturesSplit';
|
||||
import ContactCta from '@/components/sections/contact/ContactCta';
|
||||
import FaqTabbedAccordion from '@/components/sections/faq/FaqTabbedAccordion';
|
||||
import FeaturesDetailedSteps from '@/components/sections/features/FeaturesDetailedSteps';
|
||||
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
|
||||
import HeroCenteredLogos from '@/components/sections/hero/HeroCenteredLogos';
|
||||
import MetricsIconCards from '@/components/sections/metrics/MetricsIconCards';
|
||||
import PricingMediaCards from '@/components/sections/pricing/PricingMediaCards';
|
||||
import TestimonialTrustCard from '@/components/sections/testimonial/TestimonialTrustCard';
|
||||
import { Award, CheckCircle, CheckSquare, Rocket, 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 ProcessSection from './HomePage/sections/Process';
|
||||
import WorkSection from './HomePage/sections/Work';
|
||||
import PricingSection from './HomePage/sections/Pricing';
|
||||
import MetricsSection from './HomePage/sections/Metrics';
|
||||
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/female-web-designer-office-with-tablet-device_23-2149749888.jpg",
|
||||
"http://img.b2bpic.net/free-photo/positive-hipster-entrepreneur-it-expert-software-developer_74855-3635.jpg",
|
||||
"http://img.b2bpic.net/free-photo/interior-designer-working-out-office_23-2150379221.jpg",
|
||||
"http://img.b2bpic.net/free-photo/young-business-woman-standing-by-window-office_1303-20350.jpg",
|
||||
]}
|
||||
avatarText="Trusted by 50+ startups"
|
||||
title="Your design team, onboarded today"
|
||||
description="Replace chaotic workflows with one reliable system. TriCore delivers premium design and development on subscription—scaling with your product, not your headcount."
|
||||
primaryButton={{
|
||||
text: "Book a Call & See Pricing",
|
||||
href: "#contact",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "View Portfolio",
|
||||
href: "#work",
|
||||
}}
|
||||
names={[
|
||||
"Google",
|
||||
"Stripe",
|
||||
"Airbnb",
|
||||
"Slack",
|
||||
"Notion",
|
||||
"Figma",
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/people-working-together-animation-studio_23-2149207982.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<>
|
||||
<HeroSection />
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutFeaturesSplit
|
||||
tag="Our Philosophy"
|
||||
title="Design at the speed of your business"
|
||||
description="We bridge the gap between initial ideation and product launch with a transparent, subscription-based model."
|
||||
items={[
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Rapid Iteration",
|
||||
description: "MVP delivery in as little as 2 weeks.",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Consistent Quality",
|
||||
description: "Senior design talent on every task.",
|
||||
},
|
||||
{
|
||||
icon: CheckCircle,
|
||||
title: "Scalable Model",
|
||||
description: "Pause or cancel at any time.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/colleagues-smiling-speaking-discussing-drawings-new-ideas-office_176420-1684.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<AboutSection />
|
||||
|
||||
<div id="process" data-section="process">
|
||||
<SectionErrorBoundary name="process">
|
||||
<FeaturesDetailedSteps
|
||||
tag="How it Works"
|
||||
title="Onboarded in minutes, shipping in hours"
|
||||
description="Our workflow eliminates the overhead of hiring while keeping your product pipeline moving."
|
||||
steps={[
|
||||
{
|
||||
tag: "01",
|
||||
title: "Submit Brief",
|
||||
subtitle: "Request any design or development task.",
|
||||
description: "Unlimited requests, one clear queue.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/corporate-business-people-meeting-boardroom-african-manager-brainstorming-with-colleagues-discussing-strategy-sharing-problem-solving-ideas-collaborating-conference-room-company_482257-13747.jpg",
|
||||
},
|
||||
{
|
||||
tag: "02",
|
||||
title: "Iterate",
|
||||
subtitle: "Get drafts within 48 hours.",
|
||||
description: "Transparent revisions until perfect.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/digital-assets-business-management-system-concept_53876-133814.jpg",
|
||||
},
|
||||
{
|
||||
tag: "03",
|
||||
title: "Launch",
|
||||
subtitle: "Deploy to production.",
|
||||
description: "Ship updates with confidence.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/colleagues-discussing-new-ideas-business-meeting_176420-5035.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<ProcessSection />
|
||||
|
||||
<div id="work" data-section="work">
|
||||
<SectionErrorBoundary name="work">
|
||||
<FeaturesImageBento
|
||||
tag="Our Portfolio"
|
||||
title="Work that converts"
|
||||
description="Premium design systems crafted for high-growth companies."
|
||||
items={[
|
||||
{
|
||||
title: "SaaS Dashboard",
|
||||
description: "Productivity UI",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150038900.jpg",
|
||||
},
|
||||
{
|
||||
title: "Landing Page",
|
||||
description: "Growth focused",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/corporate-worker-analyzing-diagrams-charts-with-company-marketing-research-looking-laptop-screen-home-office-evening-business-research-results-data-computer_482257-47474.jpg",
|
||||
},
|
||||
{
|
||||
title: "Brand Icons",
|
||||
description: "System design",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-stationery-elements-fruit_23-2148851529.jpg",
|
||||
},
|
||||
{
|
||||
title: "App Prototype",
|
||||
description: "Mobile flow",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150038916.jpg",
|
||||
},
|
||||
{
|
||||
title: "Marketing Site",
|
||||
description: "High conversion",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-woman-hand-with-financial-charts-mobile-phone-laptop-table_1232-4862.jpg",
|
||||
},
|
||||
{
|
||||
title: "Product UX",
|
||||
description: "User research",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-cosmetics-flowers_23-2149270021.jpg",
|
||||
},
|
||||
{
|
||||
title: "Mobile UX",
|
||||
description: "Streamlined app",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/website-development_53876-95315.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<WorkSection />
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<SectionErrorBoundary name="pricing">
|
||||
<PricingMediaCards
|
||||
tag="Pricing"
|
||||
title="Simple subscription plans"
|
||||
description="Scale your design output predictably."
|
||||
plans={[
|
||||
{
|
||||
tag: "Pro",
|
||||
price: "$4,000",
|
||||
period: "/mo",
|
||||
features: [
|
||||
"Unlimited design requests",
|
||||
"Daily turnaround",
|
||||
"Access to Slack/Figma",
|
||||
],
|
||||
primaryButton: {
|
||||
text: "Start Now",
|
||||
href: "#contact",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/business-comparison-pricing-chart-table-layout-design_1017-55050.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<PricingSection />
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<SectionErrorBoundary name="metrics">
|
||||
<MetricsIconCards
|
||||
tag="Our Impact"
|
||||
title="Reliable delivery metrics"
|
||||
description="We measure success by your speed to market."
|
||||
metrics={[
|
||||
{
|
||||
icon: Rocket,
|
||||
title: "Average Turnaround",
|
||||
value: "48h",
|
||||
},
|
||||
{
|
||||
icon: CheckSquare,
|
||||
title: "Tasks Completed",
|
||||
value: "500+",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: "Client Satisfaction",
|
||||
value: "99%",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<MetricsSection />
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<TestimonialTrustCard
|
||||
quote="TriCore replaced our internal design team with a single subscription. The speed and quality are unmatched in the industry."
|
||||
rating={5}
|
||||
author="David Chen, CTO at TechStart"
|
||||
avatars={[
|
||||
{
|
||||
name: "David",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businessman_1098-21013.jpg",
|
||||
},
|
||||
{
|
||||
name: "Sarah",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-with-crossed-arms_23-2148920611.jpg",
|
||||
},
|
||||
{
|
||||
name: "Mike",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/time-is-money-sandglass-investment-countdown-measure-concept_53876-120489.jpg",
|
||||
},
|
||||
{
|
||||
name: "Jane",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-successful-young-businesswoman_1262-5844.jpg",
|
||||
},
|
||||
{
|
||||
name: "Tom",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/building-construction-worker-site-with-architect_23-2149124312.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<TestimonialsSection />
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<FaqTabbedAccordion
|
||||
tag="FAQ"
|
||||
title="Common questions"
|
||||
description="Everything you need to know about starting your subscription."
|
||||
categories={[
|
||||
{
|
||||
name: "General",
|
||||
items: [
|
||||
{
|
||||
question: "Can I pause my subscription?",
|
||||
answer: "Yes, pause or cancel your subscription at any time.",
|
||||
},
|
||||
{
|
||||
question: "How fast are deliverables?",
|
||||
answer: "Most tasks are completed within 48 business hours.",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<FaqSection />
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Let's Talk"
|
||||
text="Ready to scale your design team? Let's book a call to discuss your needs."
|
||||
primaryButton={{
|
||||
text: "Book a Discovery Call",
|
||||
href: "https://calendly.com",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "See Pricing Details",
|
||||
href: "#pricing",
|
||||
}}
|
||||
/>
|
||||
</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 { Award, CheckCircle, CheckSquare, Rocket, 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="Design at the speed of your business"
|
||||
description="We bridge the gap between initial ideation and product launch with a transparent, subscription-based model."
|
||||
items={[
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Rapid Iteration",
|
||||
description: "MVP delivery in as little as 2 weeks.",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Consistent Quality",
|
||||
description: "Senior design talent on every task.",
|
||||
},
|
||||
{
|
||||
icon: CheckCircle,
|
||||
title: "Scalable Model",
|
||||
description: "Pause or cancel at any time.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/colleagues-smiling-speaking-discussing-drawings-new-ideas-office_176420-1684.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 Talk"
|
||||
text="Ready to scale your design team? Let's book a call to discuss your needs."
|
||||
primaryButton={{
|
||||
text: "Book a Discovery Call",
|
||||
href: "https://calendly.com",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "See Pricing Details",
|
||||
href: "#pricing",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
35
src/pages/HomePage/sections/Faq.tsx
Normal file
35
src/pages/HomePage/sections/Faq.tsx
Normal file
@@ -0,0 +1,35 @@
|
||||
// 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 FaqTabbedAccordion from '@/components/sections/faq/FaqTabbedAccordion';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function FaqSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<FaqTabbedAccordion
|
||||
tag="FAQ"
|
||||
title="Common questions"
|
||||
description="Everything you need to know about starting your subscription."
|
||||
categories={[
|
||||
{
|
||||
name: "General",
|
||||
items: [
|
||||
{
|
||||
question: "Can I pause my subscription?",
|
||||
answer: "Yes, pause or cancel your subscription at any time.",
|
||||
},
|
||||
{
|
||||
question: "How fast are deliverables?",
|
||||
answer: "Most tasks are completed within 48 business hours.",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
43
src/pages/HomePage/sections/Hero.tsx
Normal file
43
src/pages/HomePage/sections/Hero.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 "hero" section.
|
||||
|
||||
import React from 'react';
|
||||
import HeroCenteredLogos from '@/components/sections/hero/HeroCenteredLogos';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function HeroSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroCenteredLogos
|
||||
avatarsSrc={[
|
||||
"http://img.b2bpic.net/free-photo/female-web-designer-office-with-tablet-device_23-2149749888.jpg",
|
||||
"http://img.b2bpic.net/free-photo/positive-hipster-entrepreneur-it-expert-software-developer_74855-3635.jpg",
|
||||
"http://img.b2bpic.net/free-photo/interior-designer-working-out-office_23-2150379221.jpg",
|
||||
"http://img.b2bpic.net/free-photo/young-business-woman-standing-by-window-office_1303-20350.jpg",
|
||||
]}
|
||||
avatarText="Trusted by 50+ startups"
|
||||
title="Your design team, onboarded today"
|
||||
description="Replace chaotic workflows with one reliable system. TriCore delivers premium design and development on subscription—scaling with your product, not your headcount."
|
||||
primaryButton={{
|
||||
text: "Book a Call & See Pricing",
|
||||
href: "#contact",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "View Portfolio",
|
||||
href: "#work",
|
||||
}}
|
||||
names={[
|
||||
"Google",
|
||||
"Stripe",
|
||||
"Airbnb",
|
||||
"Slack",
|
||||
"Notion",
|
||||
"Figma",
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/people-working-together-animation-studio_23-2149207982.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 MetricsIconCards from '@/components/sections/metrics/MetricsIconCards';
|
||||
import { Award, CheckCircle, CheckSquare, Rocket, Shield, Zap } from "lucide-react";
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function MetricsSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="metrics" data-section="metrics">
|
||||
<SectionErrorBoundary name="metrics">
|
||||
<MetricsIconCards
|
||||
tag="Our Impact"
|
||||
title="Reliable delivery metrics"
|
||||
description="We measure success by your speed to market."
|
||||
metrics={[
|
||||
{
|
||||
icon: Rocket,
|
||||
title: "Average Turnaround",
|
||||
value: "48h",
|
||||
},
|
||||
{
|
||||
icon: CheckSquare,
|
||||
title: "Tasks Completed",
|
||||
value: "500+",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: "Client Satisfaction",
|
||||
value: "99%",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
37
src/pages/HomePage/sections/Pricing.tsx
Normal file
37
src/pages/HomePage/sections/Pricing.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 "pricing" section.
|
||||
|
||||
import React from 'react';
|
||||
import PricingMediaCards from '@/components/sections/pricing/PricingMediaCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function PricingSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="pricing" data-section="pricing">
|
||||
<SectionErrorBoundary name="pricing">
|
||||
<PricingMediaCards
|
||||
tag="Pricing"
|
||||
title="Simple subscription plans"
|
||||
description="Scale your design output predictably."
|
||||
plans={[
|
||||
{
|
||||
tag: "Pro",
|
||||
price: "$4,000",
|
||||
period: "/mo",
|
||||
features: [
|
||||
"Unlimited design requests",
|
||||
"Daily turnaround",
|
||||
"Access to Slack/Figma",
|
||||
],
|
||||
primaryButton: {
|
||||
text: "Start Now",
|
||||
href: "#contact",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/business-comparison-pricing-chart-table-layout-design_1017-55050.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
43
src/pages/HomePage/sections/Process.tsx
Normal file
43
src/pages/HomePage/sections/Process.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 "process" section.
|
||||
|
||||
import React from 'react';
|
||||
import FeaturesDetailedSteps from '@/components/sections/features/FeaturesDetailedSteps';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function ProcessSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="process" data-section="process">
|
||||
<SectionErrorBoundary name="process">
|
||||
<FeaturesDetailedSteps
|
||||
tag="How it Works"
|
||||
title="Onboarded in minutes, shipping in hours"
|
||||
description="Our workflow eliminates the overhead of hiring while keeping your product pipeline moving."
|
||||
steps={[
|
||||
{
|
||||
tag: "01",
|
||||
title: "Submit Brief",
|
||||
subtitle: "Request any design or development task.",
|
||||
description: "Unlimited requests, one clear queue.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/corporate-business-people-meeting-boardroom-african-manager-brainstorming-with-colleagues-discussing-strategy-sharing-problem-solving-ideas-collaborating-conference-room-company_482257-13747.jpg",
|
||||
},
|
||||
{
|
||||
tag: "02",
|
||||
title: "Iterate",
|
||||
subtitle: "Get drafts within 48 hours.",
|
||||
description: "Transparent revisions until perfect.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/digital-assets-business-management-system-concept_53876-133814.jpg",
|
||||
},
|
||||
{
|
||||
tag: "03",
|
||||
title: "Launch",
|
||||
subtitle: "Deploy to production.",
|
||||
description: "Ship updates with confidence.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/colleagues-discussing-new-ideas-business-meeting_176420-5035.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
42
src/pages/HomePage/sections/Testimonials.tsx
Normal file
42
src/pages/HomePage/sections/Testimonials.tsx
Normal file
@@ -0,0 +1,42 @@
|
||||
// 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 TestimonialTrustCard from '@/components/sections/testimonial/TestimonialTrustCard';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function TestimonialsSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<SectionErrorBoundary name="testimonials">
|
||||
<TestimonialTrustCard
|
||||
quote="TriCore replaced our internal design team with a single subscription. The speed and quality are unmatched in the industry."
|
||||
rating={5}
|
||||
author="David Chen, CTO at TechStart"
|
||||
avatars={[
|
||||
{
|
||||
name: "David",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-businessman_1098-21013.jpg",
|
||||
},
|
||||
{
|
||||
name: "Sarah",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-with-crossed-arms_23-2148920611.jpg",
|
||||
},
|
||||
{
|
||||
name: "Mike",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/time-is-money-sandglass-investment-countdown-measure-concept_53876-120489.jpg",
|
||||
},
|
||||
{
|
||||
name: "Jane",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-successful-young-businesswoman_1262-5844.jpg",
|
||||
},
|
||||
{
|
||||
name: "Tom",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/building-construction-worker-site-with-architect_23-2149124312.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="Our Portfolio"
|
||||
title="Work that converts"
|
||||
description="Premium design systems crafted for high-growth companies."
|
||||
items={[
|
||||
{
|
||||
title: "SaaS Dashboard",
|
||||
description: "Productivity UI",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150038900.jpg",
|
||||
},
|
||||
{
|
||||
title: "Landing Page",
|
||||
description: "Growth focused",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/corporate-worker-analyzing-diagrams-charts-with-company-marketing-research-looking-laptop-screen-home-office-evening-business-research-results-data-computer_482257-47474.jpg",
|
||||
},
|
||||
{
|
||||
title: "Brand Icons",
|
||||
description: "System design",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-stationery-elements-fruit_23-2148851529.jpg",
|
||||
},
|
||||
{
|
||||
title: "App Prototype",
|
||||
description: "Mobile flow",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/representations-user-experience-interface-design_23-2150038916.jpg",
|
||||
},
|
||||
{
|
||||
title: "Marketing Site",
|
||||
description: "High conversion",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-woman-hand-with-financial-charts-mobile-phone-laptop-table_1232-4862.jpg",
|
||||
},
|
||||
{
|
||||
title: "Product UX",
|
||||
description: "User research",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-cosmetics-flowers_23-2149270021.jpg",
|
||||
},
|
||||
{
|
||||
title: "Mobile UX",
|
||||
description: "Streamlined app",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/website-development_53876-95315.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user