Update src/app/page.tsx

This commit is contained in:
2026-05-11 16:23:07 +00:00
parent 25475e63bb
commit 7926d7a4a5

View File

@@ -2,6 +2,7 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import { useState } from "react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
@@ -13,7 +14,46 @@ import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TeamCardFive from '@/components/sections/team/TeamCardFive';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
const i18n = {
en: {
nav: ["Home", "Services", "Team", "Contact"],
hero: { title: "Translation Agency", desc: "Professional, high-quality translation services in Russian, Persian, and English. Accuracy and speed for your business needs.", btn1: "Contact Us", btn2: "Our Services" },
services: { title: "Our Translation Services", desc: "Providing accurate, culturally nuanced translations for Russian, Persian, and English markets.", features: [{ title: "Technical Translation", sub: "Specialized industry texts", cat: "Localization", val: "High precision" }, { title: "Legal Translation", sub: "Contracts and documents", cat: "Documentation", val: "Certified accuracy" }, { title: "Consecutive Interpretation", sub: "Meetings and events", cat: "Interpreting", val: "Real-time expertise" }] },
team: { title: "Meet Our Experts", desc: "Qualified linguistic professionals native to their working languages.", members: [{ name: "Elena V.", role: "Senior Russian Editor" }, { name: "Reza A.", role: "Persian Liaison" }, { name: "James B.", role: "English Specialist" }] },
metrics: { title: "Our Impact", desc: "Excellence defined by data.", m1: "Projects Completed", m2: "Accuracy Rate", m3: "Support" },
testimonials: { title: "Client Feedback", desc: "What our clients say about us.", t1: "Exceptional accuracy and speed.", t2: "Best for Russian market.", t3: "Fluent and natural.", t4: "Technical terminology unmatched.", t5: "Reliable partner.", t6: "Excellent results." },
faq: { title: "Common Questions", desc: "Everything you need to know.", items: [{ q: "How do you ensure translation quality?", a: "Triple-layer proofreading process." }, { q: "Can you handle legal translations?", a: "Yes, we specialize in official documents." }, { q: "Do you offer Persian to Russian services?", a: "Yes, we cover all combinations." }] },
contact: { text: "Ready to get started? Contact us today.", btn: "Email Us" },
footer: { logo: "Translation Agency", left: "Privacy Policy", right: "Terms of Service" }
},
ru: {
nav: ["Главная", "Услуги", "Команда", "Контакты"],
hero: { title: "Агентство Переводов", desc: "Профессиональные переводы на русский, персидский и английский. Точность и скорость.", btn1: "Связаться", btn2: "Наши услуги" },
services: { title: "Наши услуги перевода", desc: "Точные переводы с учетом культурных особенностей.", features: [{ title: "Технический перевод", sub: "Специализированные тексты", cat: "Локализация", val: "Высокая точность" }, { title: "Юридический перевод", sub: "Контракты и документы", cat: "Документация", val: "Сертифицированная точность" }, { title: "Последовательный перевод", sub: "Встречи и мероприятия", cat: "Перевод", val: "Экспертиза в реальном времени" }] },
team: { title: "Наша команда", desc: "Квалифицированные лингвисты, носители языка.", members: [{ name: "Елена В.", role: "Старший редактор (RU)" }, { name: "Реза А.", role: "Специалист (FA)" }, { name: "Джеймс Б.", role: "Специалист (EN)" }] },
metrics: { title: "Наши результаты", desc: "Качество, подтвержденное цифрами.", m1: "Проектов завершено", m2: "Точность", m3: "Поддержка" },
testimonials: { title: "Отзывы клиентов", desc: "Что говорят наши клиенты.", t1: "Исключительная точность.", t2: "Лучшие для рынка РФ.", t3: "Естественно и профессионально.", t4: "Непревзойденная работа с терминами.", t5: "Надежный партнер.", t6: "Отличные результаты." },
faq: { title: "Вопросы", desc: "Все, что нужно знать.", items: [{ q: "Как вы гарантируете качество?", a: "Тройная проверка качества." }, { q: "Вы работаете с юр. документами?", a: "Да, специализируемся на документах." }, { q: "Перевод с персидского?", a: "Да, работаем со всеми комбинациями." }] },
contact: { text: "Готовы начать? Свяжитесь с нами.", btn: "Написать нам" },
footer: { logo: "Агентство", left: "Политика конфиденциальности", right: "Условия использования" }
},
fa: {
nav: ["اصلی", "خدمات", "تیم", "تماس"],
hero: { title: "آژانس ترجمه", desc: "خدمات حرفه‌ای ترجمه به زبان‌های روسی، فارسی و انگلیسی.", btn1: "تماس با ما", btn2: "خدمات ما" },
services: { title: "خدمات ترجمه ما", desc: "ارائه ترجمه‌های دقیق و مطابق با فرهنگ.", features: [{ title: "ترجمه فنی", sub: "متون تخصصی", cat: "بومی‌سازی", val: "دقت بالا" }, { title: "ترجمه حقوقی", sub: "قراردادها و اسناد", cat: "مستندات", val: "دقت تاییدشده" }, { title: "ترجمه همزمان", sub: "جلسات و رویدادها", cat: "تفسیر", val: "تخصص زنده" }] },
team: { title: "متخصصین ما", desc: "متخصصین زبانی مجرب.", members: [{ name: "النا و.", role: "ویراستار ارشد (RU)" }, { name: "رضا الف.", role: "متخصص زبان فارسی" }, { name: "جیمز ب.", role: "متخصص زبان انگلیسی" }] },
metrics: { title: "دستاوردهای ما", desc: "تعالی با داده‌ها.", m1: "پروژه‌های تکمیل‌شده", m2: "نرخ دقت", m3: "پشتیبانی" },
testimonials: { title: "بازخورد مشتریان", desc: "آنچه مشتریان درباره ما می‌گویند.", t1: "دقت و سرعت استثنایی.", t2: "بهترین برای بازار روسیه.", t3: "روان و طبیعی.", t4: "اصطلاحات فنی بی‌نظیر.", t5: "شریک قابل اعتماد.", t6: "نتایج عالی." },
faq: { title: "پرسش‌های رایج", desc: "آنچه باید بدانید.", items: [{ q: "چگونه کیفیت را تضمین می‌کنید؟", a: "فرآیند بررسی سه‌لایه." }, { q: "آیا ترجمه حقوقی انجام می‌دهید؟", a: "بله، تخصص ما اسناد رسمی است." }, { q: "ترجمه فارسی به روسی؟", a: "بله، تمامی ترکیب‌ها را پوشش می‌دهیم." }] },
contact: { text: "آماده شروع هستید؟ تماس بگیرید.", btn: "ایمیل به ما" },
footer: { logo: "آژانس ترجمه", left: "سیاست حریم خصوصی", right: "شرایط خدمات" }
}
};
export default function LandingPage() {
const [lang, setLang] = useState<'en' | 'ru' | 'fa'>('en');
const t = i18n[lang];
return (
<ThemeProvider
defaultButtonVariant="shift-hover"
@@ -28,141 +68,82 @@ export default function LandingPage() {
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{ name: "Main / Главная / اصلی", id: "hero" },
{ name: "Services / Услуги / خدمات", id: "services" },
{ name: "Team / Команда / تیم", id: "team" },
{ name: "Contact / Контакты / تماس", id: "contact" },
]}
brandName="Translation Agency"
/>
</div>
<div id="nav" data-section="nav" className="flex items-center justify-between p-4">
<div className="flex gap-2">
{(['en', 'ru', 'fa'] as const).map(l => (
<button key={l} onClick={() => setLang(l)} className={`px-2 py-1 uppercase ${lang === l ? 'font-bold underline' : ''}`}>{l}</button>
))}
</div>
<NavbarStyleFullscreen
navItems={t.nav.map((name, i) => ({ name, id: ['hero', 'services', 'team', 'contact'][i] }))}
brandName={t.footer.logo}
/>
</div>
<div id="hero" data-section="hero">
<HeroCarouselLogo
logoText="Translation Agency / Агентство Переводов / آژانس ترجمه"
description="Professional, high-quality translation services in Russian, Persian, and English. Accuracy and speed for your business needs. / Профессиональные переводы на русский, персидский и английский. / خدمات حرفه‌ای ترجمه به زبان‌های روسی، فارسی و انگلیسی."
buttons={[
{ text: "Contact Us / Связаться / تماس با ما", href: "#contact" },
{ text: "Our Services / Наши услуги / خدمات ما", href: "#services" },
]}
slides={[
{ imageSrc: "http://img.b2bpic.net/free-photo/confident-pretty-young-businesswoman-greeting-colleagues-smiling-professional-successful-content-managers-standing-outdoors-making-agreement-handshaking-teamwork-partnership-concept_74855-6929.jpg", imageAlt: "Translation Services" },
{ imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-women-discussing-with-travel-agent_23-2149080785.jpg", imageAlt: "Professional Team" },
{ imageSrc: "http://img.b2bpic.net/free-photo/fake-news-concept-view_23-2148873229.jpg", imageAlt: "Multilingual Communication" },
{ imageSrc: "http://img.b2bpic.net/free-photo/frustrated-businesswoman-having-problem-with-working-laptop_482257-8063.jpg", imageAlt: "Document Translation" },
{ imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-chat-bubbles-with-paper-shape-communication_23-2148796082.jpg", imageAlt: "Global Connections" },
{ imageSrc: "http://img.b2bpic.net/free-photo/bucharest-romania-july-30th-2024-male-ceo-watching-olympic-games-stream_482257-123108.jpg", imageAlt: "Digital Services" },
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroCarouselLogo
logoText={t.hero.title}
description={t.hero.desc}
buttons={[{ text: t.hero.btn1, href: "#contact" }, { text: t.hero.btn2, href: "#services" }]}
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentyEight
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
features={[
{ id: "1", title: "Technical Translation / Технический перевод / ترجمه فنی", subtitle: "Specialized industry texts / Специализированные тексты / متون تخصصی", category: "Localization", value: "High precision" },
{ id: "2", title: "Legal Translation / Юридический перевод / ترجمه حقوقی", subtitle: "Contracts and documents / Контракты и документы / قراردادها و اسناد", category: "Documentation", value: "Certified accuracy" },
{ id: "3", title: "Consecutive Interpretation / Последовательный перевод / ترجمه همزمان", subtitle: "Meetings and events / Встречи и мероприятия / جلسات و رویدادها", category: "Interpreting", value: "Real-time expertise" },
]}
title="Our Translation Services / Наши услуги перевода / خدمات ترجمه ما"
description="Providing accurate, culturally nuanced translations for Russian, Persian, and English markets. / Точные переводы с учетом культурных особенностей. / ارائه ترجمه‌های دقیق و مطابق با فرهنگ بازار."
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentyEight
title={t.services.title}
description={t.services.desc}
features={t.services.features.map((f, i) => ({ id: (i+1).toString(), title: f.title, subtitle: f.sub, category: f.cat, value: f.val }))}
/>
</div>
<div id="team" data-section="team">
<TeamCardFive
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
team={[
{ id: "1", name: "Elena V.", role: "Senior Russian Editor / Старший редактор (RU) / ویراستار ارشد (RU)", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-blonde-businesswoman-formal-dressed-isolated-dark-textured-background_613910-5399.jpg" },
{ id: "2", name: "Reza A.", role: "Persian Liaison / Персидский специалист / متخصص زبان فارسی", imageSrc: "http://img.b2bpic.net/free-photo/happy-young-woman-talking-phone-emotion-concept-closeup_169016-66074.jpg" },
{ id: "3", name: "James B.", role: "English Specialist / Английский специалист / متخصص زبان انگلیسی", imageSrc: "http://img.b2bpic.net/free-photo/confident-handsome-businessman-suit-glasses-looking-serious_176420-31755.jpg" },
]}
title="Meet Our Experts / Наша команда / متخصصین ما"
description="Qualified linguistic professionals native to their working languages. / Квалифицированные эксперты. / متخصصین زبانی مجرب."
/>
</div>
<div id="team" data-section="team">
<TeamCardFive
title={t.team.title}
description={t.team.desc}
team={t.team.members.map((m, i) => ({ id: (i+1).toString(), name: m.name, role: m.role }))}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardEleven
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
metrics={[
{ id: "1", value: "10k+", title: "Projects Completed / Проектов завершено / پروژه‌های تکمیل‌شده", description: "Successful translation engagements", imageSrc: "http://img.b2bpic.net/free-photo/high-tech-view-futuristic-earth_23-2151100372.jpg" },
{ id: "2", value: "99.9%", title: "Accuracy Rate / Точность / نرخ دقت", description: "Dedicated proofreading standards", imageSrc: "http://img.b2bpic.net/free-photo/collage-customer-experience-concept_23-2149367128.jpg" },
{ id: "3", value: "24/7", title: "Support / Поддержка / پشتیبانی", description: "Always ready to assist", imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-doing-sport-with-stats_23-2150040500.jpg" },
]}
title="Our Impact / Наши результаты / دستاوردهای ما"
description="Excellence defined by data. / Качество, подтвержденное цифрами. / تعالی با داده‌ها."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardEleven
title={t.metrics.title}
description={t.metrics.desc}
metrics={t.metrics.m1 ? [{id: "1", value: "10k+", title: t.metrics.m1, description: "..", imageSrc: ""}, {id: "2", value: "99.9%", title: t.metrics.m2, description: "..", imageSrc: ""}, {id: "3", value: "24/7", title: t.metrics.m3, description: "..", imageSrc: ""}] : []}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
testimonials={[
{ id: "1", name: "Anna S.", role: "Legal Manager", testimonial: "Exceptional accuracy and speed. / Исключительная точность и скорость. / دقت و سرعت استثنایی.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-businessman-suit-looking-camera-meeting_1163-4654.jpg" },
{ id: "2", name: "Farhad K.", role: "Director", testimonial: "Best for Russian market. / Лучшие для рынка РФ. / بهترین برای بازار روسیه.", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-businesswoman-office_1098-21907.jpg" },
{ id: "3", name: "Sarah W.", role: "Marketing Head", testimonial: "Fluent and natural. / Естественно и профессионально. / روان و طبیعی.", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-african-american-businessman_1262-20994.jpg" },
{ id: "4", name: "Dmitry P.", role: "Entrepreneur", testimonial: "Technical terminology unmatched. / Непревзойденная работа с терминологией. / اصطلاحات فنی بی‌نظیر.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-business-office-business-center_1303-20365.jpg" },
{ id: "5", name: "Layla M.", role: "Consultant", testimonial: "Reliable partner. / Надежный партнер. / شریک قابل اعتماد.", imageSrc: "http://img.b2bpic.net/free-photo/successful-executive-businessman-office_1098-21340.jpg" },
{ id: "6", name: "John R.", role: "Executive", testimonial: "Excellent results. / Отличные результаты. / نتایج عالی.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg" },
]}
title="Client Feedback / Отзывы клиентов / بازخورد مشتریان"
description="What our clients say about us. / Что говорят наши клиенты. / آنچه مشتریان درباره ما می‌گویند."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwo
title={t.testimonials.title}
description={t.testimonials.desc}
testimonials={t.testimonials.t1 ? [{id: "1", name: "..", role: "..", testimonial: t.testimonials.t1}, {id: "2", name: "..", role: "..", testimonial: t.testimonials.t2}, {id: "3", name: "..", role: "..", testimonial: t.testimonials.t3}, {id: "4", name: "..", role: "..", testimonial: t.testimonials.t4}, {id: "5", name: "..", role: "..", testimonial: t.testimonials.t5}, {id: "6", name: "..", role: "..", testimonial: t.testimonials.t6}] : []}
/>
</div>
<div id="socialProof" data-section="socialProof">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
names={[
"Alpha Tech", "Global Logistics", "Legal Group", "Persian Trade", "Moscow Import", "English Solutions", "Modern Consulting"]}
title="Trusted By Global Partners / Доверие партнеров / مورد اعتماد شرکای جهانی"
description="Serving international businesses. / Работаем с компаниями по всему миру. / خدمت به کسب‌وکارهای بین‌المللی."
/>
</div>
<div id="socialProof" data-section="socialProof"><SocialProofOne names={[]} title="Trusted Partners" /></div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={false}
faqs={[
{ id: "1", title: "How do you ensure translation quality? / Как вы гарантируете качество? / چگونه کیفیت را تضمین می‌کنید؟", content: "Triple-layer proofreading process. / Тройная проверка качества. / فرآیند بررسی سه‌لایه." },
{ id: "2", title: "Can you handle legal translations? / Вы работаете с юридическими текстами? / آیا ترجمه حقوقی انجام می‌دهید؟", content: "Yes, we specialize in official documents. / Да, специализируемся на документах. / بله، تخصص ما اسناد رسمی است." },
{ id: "3", title: "Do you offer Persian to Russian services? / Есть ли перевод с персидского? / آیا ترجمه فارسی به روسی دارید؟", content: "Yes, we cover all combinations. / Да, работаем со всеми комбинациями. / بله، تمامی ترکیب‌ها را پوشش می‌دهیم." },
]}
sideTitle="Common Questions / Вопросы / پرسش‌های رایج"
sideDescription="Everything you need to know. / Все, что нужно знать. / آنچه باید بدانید."
faqsAnimation="slide-up"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
sideTitle={t.faq.title}
sideDescription={t.faq.desc}
faqs={t.faq.items.map((i, idx) => ({ id: (idx+1).toString(), title: i.q, content: i.a }))}
/>
</div>
<div id="contact" data-section="contact">
<ContactText
useInvertedBackground={false}
background={{ variant: "plain" }}
text="Ready to get started? Contact us today. / Готовы начать? Свяжитесь с нами. / آماده شروع هستید؟ همین امروز با ما تماس بگیرید."
buttons={[{ text: "Email Us / Написать нам / ایمیل به ما", href: "mailto:hello@example.com" }]}
/>
</div>
<div id="contact" data-section="contact">
<ContactText
text={t.contact.text}
buttons={[{ text: t.contact.btn, href: "#" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Translation Agency / Агентство / آژانس"
leftLink={{ text: "Privacy Policy / Политика конфиденциальности / سیاست حریم خصوصی", href: "#" }}
rightLink={{ text: "Terms of Service / Условия использования / شرایط خدمات", href: "#" }}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText={t.footer.logo}
leftLink={{ text: t.footer.left, href: "#" }}
rightLink={{ text: t.footer.right, href: "#" }}
/>
</div>
</ReactLenis>
</ThemeProvider>
);