Merge version_2_1782164550400 into main #2
@@ -32,21 +32,21 @@
|
||||
--width-carousel-item-3: calc(var(--width-content-width) / 3 - var(--vw-1_5) / 3 * 2);
|
||||
--width-carousel-item-4: calc(var(--width-content-width) / 4 - var(--vw-1_5) / 4 * 3);
|
||||
|
||||
/* @typography/text-sizing/medium */
|
||||
--text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
--text-xs: clamp(0.54rem, 0.72vw, 0.72rem);
|
||||
--text-sm: clamp(0.615rem, 0.82vw, 0.82rem);
|
||||
--text-base: clamp(0.69rem, 0.92vw, 0.92rem);
|
||||
--text-lg: clamp(0.75rem, 1vw, 1rem);
|
||||
--text-xl: clamp(0.825rem, 1.1vw, 1.1rem);
|
||||
--text-2xl: clamp(0.975rem, 1.3vw, 1.3rem);
|
||||
--text-3xl: clamp(1.2rem, 1.6vw, 1.6rem);
|
||||
--text-4xl: clamp(1.5rem, 2vw, 2rem);
|
||||
--text-5xl: clamp(2.025rem, 2.75vw, 2.75rem);
|
||||
--text-6xl: clamp(2.475rem, 3.3vw, 3.3rem);
|
||||
--text-7xl: clamp(3rem, 4vw, 4rem);
|
||||
--text-8xl: clamp(3.5rem, 4.5vw, 4.5rem);
|
||||
--text-9xl: clamp(5.25rem, 7vw, 7rem);
|
||||
/* @typography/text-sizing/large */
|
||||
--text-2xs: clamp(0.5rem, 0.7vw, 0.7rem);
|
||||
--text-xs: clamp(0.6rem, 0.8vw, 0.8rem);
|
||||
--text-sm: clamp(0.7rem, 0.9vw, 0.9rem);
|
||||
--text-base: clamp(0.8rem, 1.1vw, 1.1rem);
|
||||
--text-lg: clamp(0.9rem, 1.3vw, 1.3rem);
|
||||
--text-xl: clamp(1.1rem, 1.5vw, 1.5rem);
|
||||
--text-2xl: clamp(1.3rem, 1.8vw, 1.8rem);
|
||||
--text-3xl: clamp(1.6rem, 2.2vw, 2.2rem);
|
||||
--text-4xl: clamp(2rem, 2.8vw, 2.8rem);
|
||||
--text-5xl: clamp(2.6rem, 3.8vw, 3.8rem);
|
||||
--text-6xl: clamp(3.2rem, 4.6vw, 4.6rem);
|
||||
--text-7xl: clamp(4rem, 5.8vw, 5.8rem);
|
||||
--text-8xl: clamp(5rem, 7.2vw, 7.2rem);
|
||||
--text-9xl: clamp(7rem, 10vw, 10rem);
|
||||
}
|
||||
|
||||
/* @typography/text-sizing/medium (mobile) */
|
||||
|
||||
@@ -1,280 +1,36 @@
|
||||
import AboutMediaOverlay from '@/components/sections/about/AboutMediaOverlay';
|
||||
import ContactCta from '@/components/sections/contact/ContactCta';
|
||||
import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
|
||||
import FeaturesArrowCards from '@/components/sections/features/FeaturesArrowCards';
|
||||
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
|
||||
import HeroTiltedCards from '@/components/sections/hero/HeroTiltedCards';
|
||||
import PricingHighlightedCards from '@/components/sections/pricing/PricingHighlightedCards';
|
||||
import TestimonialTrustCard from '@/components/sections/testimonial/TestimonialTrustCard';
|
||||
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 FeaturesSection from './HomePage/sections/Features';
|
||||
import BentoSection from './HomePage/sections/Bento';
|
||||
import PricingSection from './HomePage/sections/Pricing';
|
||||
import TestimonialSection from './HomePage/sections/Testimonial';
|
||||
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">
|
||||
<HeroTiltedCards
|
||||
tag="Next-Gen Infrastructure"
|
||||
title="Sync your entire workflow in one unified platform."
|
||||
description="DevSync empowers modern engineering teams to scale with speed, security, and seamless integration."
|
||||
primaryButton={{
|
||||
text: "Get Started",
|
||||
href: "#contact",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "View Features",
|
||||
href: "#features",
|
||||
}}
|
||||
items={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/global-communication-background-business-network-design_53876-160250.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/illustration-geometric-shapes-with-colorful-neon-laser-lights-perfect-backgrounds_181624-34429.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-modern-network-communications-with-connecting-lines-dots-structure_1048-13636.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cosmic-environment-with-colorful-neon-laser-lights_181624-34446.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-closeup-shot-epcot-taken-night-with-amazing-colored-textures-dark-background_181624-2158.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<>
|
||||
<HeroSection />
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutMediaOverlay
|
||||
tag="Our Mission"
|
||||
title="We build tools that define the future of development."
|
||||
description="With over a decade of industry expertise, we specialize in building robust tools that streamline every part of the development lifecycle, ensuring our partners stay ahead in a rapidly changing market."
|
||||
primaryButton={{
|
||||
text: "Read About Us",
|
||||
href: "#",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/student-desk-with-computer-books-notepads-wooden-table_169016-55183.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<AboutSection />
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<SectionErrorBoundary name="features">
|
||||
<FeaturesArrowCards
|
||||
tag="Core Capabilities"
|
||||
title="Powerful features for engineering scale."
|
||||
description="Our suite provides complete visibility and control over your tech ecosystem, from code to production."
|
||||
items={[
|
||||
{
|
||||
title: "Rapid Deployment",
|
||||
tags: [
|
||||
"SaaS",
|
||||
"CI/CD",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hand-hold-space-rocket-paper-carving-with-sky-background_53876-30288.jpg",
|
||||
},
|
||||
{
|
||||
title: "Secure Infrastructure",
|
||||
tags: [
|
||||
"Security",
|
||||
"Compliance",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/computer-security-with-3d-shields-with-padlocks_107791-16214.jpg",
|
||||
},
|
||||
{
|
||||
title: "Cloud Orchestration",
|
||||
tags: [
|
||||
"Cloud",
|
||||
"Scalability",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/flat-design-data-logo-template_23-2149199478.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<FeaturesSection />
|
||||
|
||||
<div id="bento" data-section="bento">
|
||||
<SectionErrorBoundary name="bento">
|
||||
<FeaturesImageBento
|
||||
tag="Product Gallery"
|
||||
title="See DevSync in action."
|
||||
description="A glimpse into the interface and capabilities that power our enterprise-grade architecture."
|
||||
items={[
|
||||
{
|
||||
title: "Global CDN",
|
||||
description: "High availability edge networks.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dark-textured-surface-with-subtle-light_84443-73009.jpg",
|
||||
},
|
||||
{
|
||||
title: "Metrics",
|
||||
description: "Deep insights in real-time.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-frame-background-connecting-dots-digital-network-design_53876-153345.jpg",
|
||||
},
|
||||
{
|
||||
title: "Workflow",
|
||||
description: "Automated pipelines.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-home-using-generative-artificial-intelligence-website-make-videos_482257-119719.jpg",
|
||||
},
|
||||
{
|
||||
title: "Hardware",
|
||||
description: "Server efficiency stats.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/technology-background-texture_23-2148105529.jpg",
|
||||
},
|
||||
{
|
||||
title: "Automation",
|
||||
description: "Self-healing code paths.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vintage-collage-couple-hugging-bird_23-2149438110.jpg",
|
||||
},
|
||||
{
|
||||
title: "Input",
|
||||
description: "Enhanced development.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/person-conducting-online-psychologist-therapy_23-2149407952.jpg",
|
||||
},
|
||||
{
|
||||
title: "Glass UI",
|
||||
description: "Seamless visual control.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-black-white-background_23-2150913793.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<BentoSection />
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<SectionErrorBoundary name="pricing">
|
||||
<PricingHighlightedCards
|
||||
tag="Flexible Plans"
|
||||
title="Transparent pricing for any scale."
|
||||
description="Start with our free tier and scale seamlessly into our enterprise solutions."
|
||||
plans={[
|
||||
{
|
||||
tag: "Basic",
|
||||
price: "$29/mo",
|
||||
description: "Perfect for individuals and side projects.",
|
||||
features: [
|
||||
"1 API key",
|
||||
"Standard support",
|
||||
"Basic analytics",
|
||||
],
|
||||
primaryButton: {
|
||||
text: "Get Started",
|
||||
href: "#",
|
||||
},
|
||||
},
|
||||
{
|
||||
tag: "Professional",
|
||||
price: "$99/mo",
|
||||
description: "Best for growing engineering teams.",
|
||||
features: [
|
||||
"10 API keys",
|
||||
"24/7 support",
|
||||
"Advanced analytics",
|
||||
],
|
||||
highlight: "Recommended",
|
||||
primaryButton: {
|
||||
text: "Choose Pro",
|
||||
href: "#",
|
||||
},
|
||||
},
|
||||
{
|
||||
tag: "Enterprise",
|
||||
price: "Custom",
|
||||
description: "Tailored for large-scale operations.",
|
||||
features: [
|
||||
"Unlimited keys",
|
||||
"Dedicated manager",
|
||||
"SLA guarantees",
|
||||
],
|
||||
primaryButton: {
|
||||
text: "Contact Sales",
|
||||
href: "#contact",
|
||||
},
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<PricingSection />
|
||||
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<SectionErrorBoundary name="testimonial">
|
||||
<TestimonialTrustCard
|
||||
quote="DevSync completely transformed how we ship code. We have reduced our deployment latency by over 60% since implementation."
|
||||
rating={5}
|
||||
author="Sarah Chen, Chief Architect at InnovateLabs"
|
||||
avatars={[
|
||||
{
|
||||
name: "Sarah",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/videographer-smiling-camera-working-computer-editing-video-footage-audio-app-sitting-mo_482257-2649.jpg",
|
||||
},
|
||||
{
|
||||
name: "Mike",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-modern-male_23-2148514900.jpg",
|
||||
},
|
||||
{
|
||||
name: "Emma",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-smiling-kitchen_107420-12357.jpg",
|
||||
},
|
||||
{
|
||||
name: "David",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-man-sitting-front-laptop-workplace_23-2148187164.jpg",
|
||||
},
|
||||
{
|
||||
name: "Chloe",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-employee-happy-be-back-work_23-2148727616.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<TestimonialSection />
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<FaqTwoColumn
|
||||
tag="Knowledge Base"
|
||||
title="Frequently Asked Questions"
|
||||
description="Everything you need to know about getting started."
|
||||
items={[
|
||||
{
|
||||
question: "What integrations do you support?",
|
||||
answer: "We support all major CI/CD providers including GitHub, GitLab, and Bitbucket out of the box.",
|
||||
},
|
||||
{
|
||||
question: "Is my data secure?",
|
||||
answer: "Your data is encrypted at rest and in transit with industry-standard TLS 1.3 and AES-256.",
|
||||
},
|
||||
{
|
||||
question: "Can I switch plans anytime?",
|
||||
answer: "Yes, you can upgrade, downgrade, or cancel your plan at any time through our dashboard.",
|
||||
},
|
||||
{
|
||||
question: "Do you offer enterprise SLAs?",
|
||||
answer: "Yes, we provide 99.99% uptime guarantees for our enterprise customers.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<FaqSection />
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Get in Touch"
|
||||
text="Ready to accelerate your engineering productivity? Connect with our team today."
|
||||
primaryButton={{
|
||||
text: "Schedule a Demo",
|
||||
href: "#",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Talk to Sales",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
<ContactSection />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
25
src/pages/HomePage/sections/About.tsx
Normal file
25
src/pages/HomePage/sections/About.tsx
Normal file
@@ -0,0 +1,25 @@
|
||||
// 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 AboutMediaOverlay from '@/components/sections/about/AboutMediaOverlay';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function AboutSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutMediaOverlay
|
||||
tag="Our Mission"
|
||||
title="We build tools that define the future of development."
|
||||
description="With over a decade of industry expertise, we specialize in building robust tools that streamline every part of the development lifecycle, ensuring our partners stay ahead in a rapidly changing market."
|
||||
primaryButton={{
|
||||
text: "Read About Us",
|
||||
href: "#",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/student-desk-with-computer-books-notepads-wooden-table_169016-55183.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
57
src/pages/HomePage/sections/Bento.tsx
Normal file
57
src/pages/HomePage/sections/Bento.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 "bento" section.
|
||||
|
||||
import React from 'react';
|
||||
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function BentoSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="bento" data-section="bento">
|
||||
<SectionErrorBoundary name="bento">
|
||||
<FeaturesImageBento
|
||||
tag="Product Gallery"
|
||||
title="See DevSync in action."
|
||||
description="A glimpse into the interface and capabilities that power our enterprise-grade architecture."
|
||||
items={[
|
||||
{
|
||||
title: "Global CDN",
|
||||
description: "High availability edge networks.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dark-textured-surface-with-subtle-light_84443-73009.jpg",
|
||||
},
|
||||
{
|
||||
title: "Metrics",
|
||||
description: "Deep insights in real-time.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-frame-background-connecting-dots-digital-network-design_53876-153345.jpg",
|
||||
},
|
||||
{
|
||||
title: "Workflow",
|
||||
description: "Automated pipelines.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-home-using-generative-artificial-intelligence-website-make-videos_482257-119719.jpg",
|
||||
},
|
||||
{
|
||||
title: "Hardware",
|
||||
description: "Server efficiency stats.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/technology-background-texture_23-2148105529.jpg",
|
||||
},
|
||||
{
|
||||
title: "Automation",
|
||||
description: "Self-healing code paths.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vintage-collage-couple-hugging-bird_23-2149438110.jpg",
|
||||
},
|
||||
{
|
||||
title: "Input",
|
||||
description: "Enhanced development.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/person-conducting-online-psychologist-therapy_23-2149407952.jpg",
|
||||
},
|
||||
{
|
||||
title: "Glass UI",
|
||||
description: "Seamless visual control.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-black-white-background_23-2150913793.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="Get in Touch"
|
||||
text="Ready to accelerate your engineering productivity? Connect with our team today."
|
||||
primaryButton={{
|
||||
text: "Schedule a Demo",
|
||||
href: "#",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Talk to Sales",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
38
src/pages/HomePage/sections/Faq.tsx
Normal file
38
src/pages/HomePage/sections/Faq.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 "faq" section.
|
||||
|
||||
import React from 'react';
|
||||
import FaqTwoColumn from '@/components/sections/faq/FaqTwoColumn';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function FaqSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="faq" data-section="faq">
|
||||
<SectionErrorBoundary name="faq">
|
||||
<FaqTwoColumn
|
||||
tag="Knowledge Base"
|
||||
title="Frequently Asked Questions"
|
||||
description="Everything you need to know about getting started."
|
||||
items={[
|
||||
{
|
||||
question: "What integrations do you support?",
|
||||
answer: "We support all major CI/CD providers including GitHub, GitLab, and Bitbucket out of the box.",
|
||||
},
|
||||
{
|
||||
question: "Is my data secure?",
|
||||
answer: "Your data is encrypted at rest and in transit with industry-standard TLS 1.3 and AES-256.",
|
||||
},
|
||||
{
|
||||
question: "Can I switch plans anytime?",
|
||||
answer: "Yes, you can upgrade, downgrade, or cancel your plan at any time through our dashboard.",
|
||||
},
|
||||
{
|
||||
question: "Do you offer enterprise SLAs?",
|
||||
answer: "Yes, we provide 99.99% uptime guarantees for our enterprise customers.",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
46
src/pages/HomePage/sections/Features.tsx
Normal file
46
src/pages/HomePage/sections/Features.tsx
Normal file
@@ -0,0 +1,46 @@
|
||||
// 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 FeaturesArrowCards from '@/components/sections/features/FeaturesArrowCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function FeaturesSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="features" data-section="features">
|
||||
<SectionErrorBoundary name="features">
|
||||
<FeaturesArrowCards
|
||||
tag="Core Capabilities"
|
||||
title="Powerful features for engineering scale."
|
||||
description="Our suite provides complete visibility and control over your tech ecosystem, from code to production."
|
||||
items={[
|
||||
{
|
||||
title: "Rapid Deployment",
|
||||
tags: [
|
||||
"SaaS",
|
||||
"CI/CD",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hand-hold-space-rocket-paper-carving-with-sky-background_53876-30288.jpg",
|
||||
},
|
||||
{
|
||||
title: "Secure Infrastructure",
|
||||
tags: [
|
||||
"Security",
|
||||
"Compliance",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/computer-security-with-3d-shields-with-padlocks_107791-16214.jpg",
|
||||
},
|
||||
{
|
||||
title: "Cloud Orchestration",
|
||||
tags: [
|
||||
"Cloud",
|
||||
"Scalability",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/flat-design-data-logo-template_23-2149199478.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
45
src/pages/HomePage/sections/Hero.tsx
Normal file
45
src/pages/HomePage/sections/Hero.tsx
Normal file
@@ -0,0 +1,45 @@
|
||||
// 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 HeroTiltedCards from '@/components/sections/hero/HeroTiltedCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function HeroSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroTiltedCards
|
||||
tag="Next-Gen Infrastructure"
|
||||
title="Sync your entire workflow in one unified platform."
|
||||
description="DevSync empowers modern engineering teams to scale with speed, security, and seamless integration."
|
||||
primaryButton={{
|
||||
text: "Get Started",
|
||||
href: "#contact",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "View Features",
|
||||
href: "#features",
|
||||
}}
|
||||
items={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/global-communication-background-business-network-design_53876-160250.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/illustration-geometric-shapes-with-colorful-neon-laser-lights-perfect-backgrounds_181624-34429.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-modern-network-communications-with-connecting-lines-dots-structure_1048-13636.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cosmic-environment-with-colorful-neon-laser-lights_181624-34446.jpg",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-closeup-shot-epcot-taken-night-with-amazing-colored-textures-dark-background_181624-2158.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
65
src/pages/HomePage/sections/Pricing.tsx
Normal file
65
src/pages/HomePage/sections/Pricing.tsx
Normal file
@@ -0,0 +1,65 @@
|
||||
// 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 PricingHighlightedCards from '@/components/sections/pricing/PricingHighlightedCards';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function PricingSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="pricing" data-section="pricing">
|
||||
<SectionErrorBoundary name="pricing">
|
||||
<PricingHighlightedCards
|
||||
tag="Flexible Plans"
|
||||
title="Transparent pricing for any scale."
|
||||
description="Start with our free tier and scale seamlessly into our enterprise solutions."
|
||||
plans={[
|
||||
{
|
||||
tag: "Basic",
|
||||
price: "$29/mo",
|
||||
description: "Perfect for individuals and side projects.",
|
||||
features: [
|
||||
"1 API key",
|
||||
"Standard support",
|
||||
"Basic analytics",
|
||||
],
|
||||
primaryButton: {
|
||||
text: "Get Started",
|
||||
href: "#",
|
||||
},
|
||||
},
|
||||
{
|
||||
tag: "Professional",
|
||||
price: "$99/mo",
|
||||
description: "Best for growing engineering teams.",
|
||||
features: [
|
||||
"10 API keys",
|
||||
"24/7 support",
|
||||
"Advanced analytics",
|
||||
],
|
||||
highlight: "Recommended",
|
||||
primaryButton: {
|
||||
text: "Choose Pro",
|
||||
href: "#",
|
||||
},
|
||||
},
|
||||
{
|
||||
tag: "Enterprise",
|
||||
price: "Custom",
|
||||
description: "Tailored for large-scale operations.",
|
||||
features: [
|
||||
"Unlimited keys",
|
||||
"Dedicated manager",
|
||||
"SLA guarantees",
|
||||
],
|
||||
primaryButton: {
|
||||
text: "Contact Sales",
|
||||
href: "#contact",
|
||||
},
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
42
src/pages/HomePage/sections/Testimonial.tsx
Normal file
42
src/pages/HomePage/sections/Testimonial.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 "testimonial" section.
|
||||
|
||||
import React from 'react';
|
||||
import TestimonialTrustCard from '@/components/sections/testimonial/TestimonialTrustCard';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
|
||||
export default function TestimonialSection(): React.JSX.Element {
|
||||
return (
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<SectionErrorBoundary name="testimonial">
|
||||
<TestimonialTrustCard
|
||||
quote="DevSync completely transformed how we ship code. We have reduced our deployment latency by over 60% since implementation."
|
||||
rating={5}
|
||||
author="Sarah Chen, Chief Architect at InnovateLabs"
|
||||
avatars={[
|
||||
{
|
||||
name: "Sarah",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/videographer-smiling-camera-working-computer-editing-video-footage-audio-app-sitting-mo_482257-2649.jpg",
|
||||
},
|
||||
{
|
||||
name: "Mike",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-modern-male_23-2148514900.jpg",
|
||||
},
|
||||
{
|
||||
name: "Emma",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-smiling-kitchen_107420-12357.jpg",
|
||||
},
|
||||
{
|
||||
name: "David",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-man-sitting-front-laptop-workplace_23-2148187164.jpg",
|
||||
},
|
||||
{
|
||||
name: "Chloe",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-employee-happy-be-back-work_23-2148727616.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user