bender/74a7d1c5-9a97-4073-bcb1-2394ba7f48d7
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2_1782064891459 into main #3

Merged
bender merged 1 commits from version_2_1782064891459 into main 2026-06-21 18:03:52 +00:00
Conversation 0 Commits 1 Files Changed 9 +297 -128
9 changed files with 297 additions and 128 deletions
Download Patch File Download Diff File Expand all files Collapse all files

153
src/pages/HomePage.tsx
View File

@@ -1,139 +1,36 @@
import ContactCta from '@/components/sections/contact/ContactCta';
import FaqSimple from '@/components/sections/faq/FaqSimple';
import FeaturesArrowCards from '@/components/sections/features/FeaturesArrowCards';
import FeaturesRevealCardsBento from '@/components/sections/features/FeaturesRevealCardsBento';
import HeroSplitMediaGrid from '@/components/sections/hero/HeroSplitMediaGrid';
import MetricsMediaCards from '@/components/sections/metrics/MetricsMediaCards';
import TeamListCards from '@/components/sections/team/TeamListCards';
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 ServicesSection from './HomePage/sections/Services';
import CaseStudiesSection from './HomePage/sections/CaseStudies';
import MetricsSection from './HomePage/sections/Metrics';
import TeamSection from './HomePage/sections/Team';
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">
<HeroSplitMediaGrid
tag="Цифрова трансформація"
title="Точні кампанії для вашого бізнесу"
description="Ми поєднуємо дані, креатив та стратегію для результатів, які змінюють метрики. Від запуску до оптимізації—ваш партнер в цифровому зростанні."
primaryButton={{ text: "Почнемо проект", href: "#contact" }}
secondaryButton={{ text: "Наші кейси", href: "#case-studies" }}
items={[{ imageSrc: "http://img.b2bpic.net/free-photo/silhouette-person-city_23-2149211335.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/tablet-shows-analytics-data-meeting_482257-120318.jpg" }]}
/>
</SectionErrorBoundary>
</div>
<>
<HeroSection />
<div id="services" data-section="services">
<SectionErrorBoundary name="services">
<FeaturesArrowCards
tag="Наші послуги"
title="Ефективний маркетинг під ключ"
description="Повний цикл рекламної підтримки для досягнення ваших цілей."
items={[
{ title: "Таргетована реклама", tags: ["Facebook", "Instagram", "ROI"], imageSrc: "http://img.b2bpic.net/free-photo/boardroom-office-space-with-desks-stationary-tools-used-everyday-executive-tasks-company-department-place-empty-startup-coworking-space-small-business-decorations_482257-70394.jpg" },
{ title: "Google Ads", tags: ["PPC", "SEM", "Growth"], imageSrc: "http://img.b2bpic.net/free-photo/young-woman-analysing-charts-laptop-start-up-business-meeting-room_482257-5026.jpg" },
{ title: "Стратегічне планування", tags: ["Analytics", "Strategy"], imageSrc: "http://img.b2bpic.net/free-photo/graph-data-show-summary-analysis-icon-graphic_53876-121371.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
<ServicesSection />
<div id="case-studies" data-section="case-studies">
<SectionErrorBoundary name="case-studies">
<FeaturesRevealCardsBento
tag="Наші кейси"
title="Результати, що вражають"
description="Реальні історії зростання наших клієнтів через точний таргетинг."
items={[
{ title: "E-commerce Ріст", description: "Збільшили конверсію на 45% для рітейлера", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/brand-branding-project-goals-word-concept_53876-120034.jpg" },
{ title: "SaaS Просування", description: "Оптимізували CPA на 30% за 3 місяці", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/coworkers-use-technology-office_482257-120242.jpg" },
{ title: "Food & Tech", description: "Залучили 10k нових клієнтів", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/dynamic-data-visualization-3d_23-2151904321.jpg" },
{ title: "Брендинг", description: "Підвищили впізнаваність на 200%", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-with-annual-evolution_1098-3503.jpg" },
{ title: "Локальний бізнес", description: "Збільшили потік клієнтів на 60%", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/close-up-entrepreneur-with-corporate-job-looking-camera-business-office-portrait-young-man-preparing-work-planning-development-industry-with-technology-computer_482257-29387.jpg" },
{ title: "Фінанси", description: "Знизили витрати на ліди на 25%", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/smiling-african-american-girl-sitting-cafe_1262-3083.jpg" },
{ title: "Стартап", description: "Масштабували продажі у 3 рази", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
<CaseStudiesSection />
<div id="metrics" data-section="metrics">
<SectionErrorBoundary name="metrics">
<MetricsMediaCards
tag="Цифри"
title="Довіра в метриках"
description="Прозорі показники ефективності для кожного клієнта."
metrics={[
{ value: "120+", title: "Клієнтів", description: "Успішних проектів", imageSrc: "http://img.b2bpic.net/free-photo/pie-chart-diagram-graphic-icon-finance-concept_53876-122983.jpg" },
{ value: "$2M+", title: "Витрачено", description: "Рекламного бюджету", imageSrc: "http://img.b2bpic.net/free-photo/digital-tablet-online-learning_53876-97299.jpg" },
{ value: "4.8", title: "ROI", description: "Середній коефіцієнт", imageSrc: "http://img.b2bpic.net/free-photo/luxurious-modern-office-space-with-important-reports-laptop-empty-desk-showcasing-important-data_482257-133861.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
<MetricsSection />
<div id="team" data-section="team">
<SectionErrorBoundary name="team">
<TeamListCards
tag="Команда"
title="Експерти вашого зростання"
description="Професіонали з досвідом у performance-маркетингу."
groups={[
{
title: "Management", members: [
{ name: "Андрій Коваль", role: "CEO", detail: "10+ років досвіду", imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-business-woman-with-executive-job-working-with-management-marketing-statistics-computer-office-worker-analyzing-research-charts-data-reports_482257-41126.jpg" },
{ name: "Олена Марченко", role: "Lead Strategist", detail: "Data-driven експерт", imageSrc: "http://img.b2bpic.net/free-photo/lawyer-doing-her-job_23-2148172253.jpg" },
{ name: "Дмитро Іванов", role: "Head of Ads", detail: "Google Ads Certified", imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-using-digital-tablet-home-office_329181-4278.jpg" }
]
}
]}
/>
</SectionErrorBoundary>
</div>
<TeamSection />
<div id="testimonials" data-section="testimonials">
<SectionErrorBoundary name="testimonials">
<TestimonialTrustCard
quote="Ця агенція змінила наш погляд на маркетинг. Результати видно з першого тижня роботи."
rating={5}
author="Сергій Мельник, Власник бізнесу"
avatars={[
{ name: "Client 1", imageSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg" },
{ name: "Client 2", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-businessman-with-crossed-arms_23-2147955274.jpg" },
{ name: "Client 3", imageSrc: "http://img.b2bpic.net/free-photo/waist-up-confident-businessman-office_329181-19349.jpg" },
{ name: "Client 4", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-attractive-businesswoman-crossing-arms_1262-4724.jpg" },
{ name: "Client 5", imageSrc: "http://img.b2bpic.net/free-photo/portrait-businessman-with-folded-arms-looking-camera_23-2147955314.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
<TestimonialsSection />
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<FaqSimple
tag="Підтримка"
title="Часті запитання"
description="Відповіді на основні моменти співпраці."
items={[
{ question: "Який мінімальний бюджет?", answer: "Ми працюємо з проектами від $500/міс." },
{ question: "Коли будуть результати?", answer: "Перші метрики ви побачите вже через 7-10 днів." },
{ question: "Як ви звітуєте?", answer: "Щотижневі звіти в Data Studio." }
]}
/>
</SectionErrorBoundary>
</div>
<FaqSection />
<div id="contact" data-section="contact">
<SectionErrorBoundary name="contact">
<ContactCta
tag="Зв'язок"
text="Готові до масштабування? Напишіть нам прямо зараз."
primaryButton={{ text: "Надіслати заявку", href: "mailto:hello@uagency.com" }}
secondaryButton={{ text: "Дізнатися більше", href: "#" }}
/>
</SectionErrorBoundary>
</div>
<ContactSection />
</>
);
}
}

29
src/pages/HomePage/sections/CaseStudies.tsx Normal file
View File

@@ -0,0 +1,29 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "case-studies" section.
import React from 'react';
import FeaturesRevealCardsBento from '@/components/sections/features/FeaturesRevealCardsBento';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function CaseStudiesSection(): React.JSX.Element {
return (
<div id="case-studies" data-section="case-studies">
<SectionErrorBoundary name="case-studies">
<FeaturesRevealCardsBento
tag="Наші кейси"
title="Результати, що вражають"
description="Реальні історії зростання наших клієнтів через точний таргетинг."
items={[
{ title: "E-commerce Ріст", description: "Збільшили конверсію на 45% для рітейлера", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/brand-branding-project-goals-word-concept_53876-120034.jpg" },
{ title: "SaaS Просування", description: "Оптимізували CPA на 30% за 3 місяці", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/coworkers-use-technology-office_482257-120242.jpg" },
{ title: "Food & Tech", description: "Залучили 10k нових клієнтів", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/dynamic-data-visualization-3d_23-2151904321.jpg" },
{ title: "Брендинг", description: "Підвищили впізнаваність на 200%", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/close-up-laptop-with-annual-evolution_1098-3503.jpg" },
{ title: "Локальний бізнес", description: "Збільшили потік клієнтів на 60%", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/close-up-entrepreneur-with-corporate-job-looking-camera-business-office-portrait-young-man-preparing-work-planning-development-industry-with-technology-computer_482257-29387.jpg" },
{ title: "Фінанси", description: "Знизили витрати на ліди на 25%", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/smiling-african-american-girl-sitting-cafe_1262-3083.jpg" },
{ title: "Стартап", description: "Масштабували продажі у 3 рази", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
);
}

21
src/pages/HomePage/sections/Contact.tsx Normal file
View File

@@ -0,0 +1,21 @@
// 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="Зв'язок"
text="Готові до масштабування? Напишіть нам прямо зараз."
primaryButton={{ text: "Надіслати заявку", href: "mailto:hello@uagency.com" }}
secondaryButton={{ text: "Дізнатися більше", href: "#" }}
/>
</SectionErrorBoundary>
</div>
);
}

25
src/pages/HomePage/sections/Faq.tsx Normal file
View File

@@ -0,0 +1,25 @@
// 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 FaqSimple from '@/components/sections/faq/FaqSimple';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function FaqSection(): React.JSX.Element {
return (
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<FaqSimple
tag="Підтримка"
title="Часті запитання"
description="Відповіді на основні моменти співпраці."
items={[
{ question: "Який мінімальний бюджет?", answer: "Ми працюємо з проектами від $500/міс." },
{ question: "Коли будуть результати?", answer: "Перші метрики ви побачите вже через 7-10 днів." },
{ question: "Як ви звітуєте?", answer: "Щотижневі звіти в Data Studio." }
]}
/>
</SectionErrorBoundary>
</div>
);
}

91
src/pages/HomePage/sections/Hero.tsx Normal file
View File

@@ -0,0 +1,91 @@
/* eslint-disable */
// @ts-nocheck — generated by catalog-eject; runtime-correct but TS strict-mode false-positives on inlined catalog body
import ButtonMagnetic from "@/components/ui/ButtonMagnetic";
import AuroraBackground from "@/components/ui/AuroraBackground";
import NoiseBackground from "@/components/ui/NoiseBackground";
import TextAnimation from "@/components/ui/TextAnimation";
import ImageOrVideo from "@/components/ui/ImageOrVideo";
import ScrollReveal from "@/components/ui/ScrollReveal";
const primaryButton = {
text: "Почнемо проект",
href: "#contact"
};
const secondaryButton = {
text: "Наші кейси",
href: "#case-studies"
};
const items = [
{
imageSrc: "http://img.b2bpic.net/free-photo/silhouette-person-city_23-2149211335.jpg"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/tablet-shows-analytics-data-meeting_482257-120318.jpg"
}
];
type HeroSplitMediaGridProps = {
tag: string;
title: string;
description: string;
primaryButton: { text: string; href: string };
secondaryButton: { text: string; href: string };
items: [
{ imageSrc: string; videoSrc?: never } | { videoSrc: string; imageSrc?: never },
{ imageSrc: string; videoSrc?: never } | { videoSrc: string; imageSrc?: never }
];
};
const HeroInline = () => {
return (
<section aria-label="Hero section" className="relative flex items-center h-fit md:h-svh pt-25 pb-20 md:py-0 overflow-hidden">
<AuroraBackground position="absolute" />
<NoiseBackground position="absolute" />
<div className="flex flex-col md:flex-row items-center gap-12 md:gap-20 w-content-width mx-auto">
<div className="w-full md:w-1/2">
<div className="flex flex-col items-center md:items-start gap-3">
<div className="px-3 py-1 mb-1 text-sm card rounded w-fit">
<p>{"Цифрова трансформація"}</p>
</div>
<TextAnimation
text={"Точні кампанії для вашого бізнесу"}
variant="fade-blur"
gradientText={true}
tag="h1"
className="text-7xl 2xl:text-8xl leading-[1.15] font-semibold text-center md:text-left text-balance"
/>
<TextAnimation
text={"Ми поєднуємо дані, креатив та стратегію для результатів, які змінюють метрики. Від запуску до оптимізації—ваш партнер в цифровому зростанні."}
variant="fade-blur"
gradientText={false}
tag="p"
className="md:max-w-8/10 text-lg md:text-xl leading-snug text-center md:text-left text-balance"
/>
<div className="flex flex-wrap max-md:justify-center gap-3 mt-2 md:mt-3">
<ButtonMagnetic text="Узнати ціну" href="#pricing" variant="primary" />
</div>
</div>
</div>
<ScrollReveal variant="fade" delay={0.2} className="w-full md:w-1/2 grid grid-cols-2 gap-2 xl:gap-3 2xl:gap-4">
{items.map((item, index) => (
<div key={index} className="h-80 md:h-[55vh] p-2 xl:p-3 2xl:p-4 card rounded overflow-hidden">
<ImageOrVideo imageSrc={item.imageSrc} videoSrc={item.videoSrc} />
</div>
))}
</ScrollReveal>
</div>
</section>
);
};
export default function HeroSection() {
return (
<div data-webild-section="hero" id="hero">
<HeroInline />
</div>
);
}

25
src/pages/HomePage/sections/Metrics.tsx Normal file
View File

@@ -0,0 +1,25 @@
// 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 MetricsMediaCards from '@/components/sections/metrics/MetricsMediaCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function MetricsSection(): React.JSX.Element {
return (
<div id="metrics" data-section="metrics">
<SectionErrorBoundary name="metrics">
<MetricsMediaCards
tag="Цифри"
title="Довіра в метриках"
description="Прозорі показники ефективності для кожного клієнта."
metrics={[
{ value: "120+", title: "Клієнтів", description: "Успішних проектів", imageSrc: "http://img.b2bpic.net/free-photo/pie-chart-diagram-graphic-icon-finance-concept_53876-122983.jpg" },
{ value: "$2M+", title: "Витрачено", description: "Рекламного бюджету", imageSrc: "http://img.b2bpic.net/free-photo/digital-tablet-online-learning_53876-97299.jpg" },
{ value: "4.8", title: "ROI", description: "Середній коефіцієнт", imageSrc: "http://img.b2bpic.net/free-photo/luxurious-modern-office-space-with-important-reports-laptop-empty-desk-showcasing-important-data_482257-133861.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
);
}

25
src/pages/HomePage/sections/Services.tsx Normal file
View File

@@ -0,0 +1,25 @@
// 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 FeaturesArrowCards from '@/components/sections/features/FeaturesArrowCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function ServicesSection(): React.JSX.Element {
return (
<div id="services" data-section="services">
<SectionErrorBoundary name="services">
<FeaturesArrowCards
tag="Наші послуги"
title="Ефективний маркетинг під ключ"
description="Повний цикл рекламної підтримки для досягнення ваших цілей."
items={[
{ title: "Таргетована реклама", tags: ["Facebook", "Instagram", "ROI"], imageSrc: "http://img.b2bpic.net/free-photo/boardroom-office-space-with-desks-stationary-tools-used-everyday-executive-tasks-company-department-place-empty-startup-coworking-space-small-business-decorations_482257-70394.jpg" },
{ title: "Google Ads", tags: ["PPC", "SEM", "Growth"], imageSrc: "http://img.b2bpic.net/free-photo/young-woman-analysing-charts-laptop-start-up-business-meeting-room_482257-5026.jpg" },
{ title: "Стратегічне планування", tags: ["Analytics", "Strategy"], imageSrc: "http://img.b2bpic.net/free-photo/graph-data-show-summary-analysis-icon-graphic_53876-121371.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
);
}

29
src/pages/HomePage/sections/Team.tsx Normal file
View File

@@ -0,0 +1,29 @@
// 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 TeamListCards from '@/components/sections/team/TeamListCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function TeamSection(): React.JSX.Element {
return (
<div id="team" data-section="team">
<SectionErrorBoundary name="team">
<TeamListCards
tag="Команда"
title="Експерти вашого зростання"
description="Професіонали з досвідом у performance-маркетингу."
groups={[
{
title: "Management", members: [
{ name: "Андрій Коваль", role: "CEO", detail: "10+ років досвіду", imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-business-woman-with-executive-job-working-with-management-marketing-statistics-computer-office-worker-analyzing-research-charts-data-reports_482257-41126.jpg" },
{ name: "Олена Марченко", role: "Lead Strategist", detail: "Data-driven експерт", imageSrc: "http://img.b2bpic.net/free-photo/lawyer-doing-her-job_23-2148172253.jpg" },
{ name: "Дмитро Іванов", role: "Head of Ads", detail: "Google Ads Certified", imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-using-digital-tablet-home-office_329181-4278.jpg" }
]
}
]}
/>
</SectionErrorBoundary>
</div>
);
}

27
src/pages/HomePage/sections/Testimonials.tsx Normal file
View File

@@ -0,0 +1,27 @@
// 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="Ця агенція змінила наш погляд на маркетинг. Результати видно з першого тижня роботи."
rating={5}
author="Сергій Мельник, Власник бізнесу"
avatars={[
{ name: "Client 1", imageSrc: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg" },
{ name: "Client 2", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-businessman-with-crossed-arms_23-2147955274.jpg" },
{ name: "Client 3", imageSrc: "http://img.b2bpic.net/free-photo/waist-up-confident-businessman-office_329181-19349.jpg" },
{ name: "Client 4", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-attractive-businesswoman-crossing-arms_1262-4724.jpg" },
{ name: "Client 5", imageSrc: "http://img.b2bpic.net/free-photo/portrait-businessman-with-folded-arms-looking-camera_23-2147955314.jpg" }
]}
/>
</SectionErrorBoundary>
</div>
);
}