Update src/app/page.tsx
This commit is contained in:
298
src/app/page.tsx
298
src/app/page.tsx
@@ -11,7 +11,8 @@ import MediaAbout from '@/components/sections/about/MediaAbout';
|
||||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
||||
import { BookOpen, Globe, Users } from "lucide-react";
|
||||
import TimelineProcessFlow from '@/components/cardStack/layouts/timelines/TimelineProcessFlow';
|
||||
import { BookOpen, Globe, Users, Target, Zap } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -31,22 +32,11 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "الرئيسية",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "الخدمات",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "الأسئلة الشائعة",
|
||||
id: "faq",
|
||||
},
|
||||
{
|
||||
name: "تواصل معنا",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "الرئيسية", id: "hero" },
|
||||
{ name: "الخدمات", id: "features" },
|
||||
{ name: "تطور الشخصيات", id: "character-arcs" },
|
||||
{ name: "تطور القصة", id: "story-development" },
|
||||
{ name: "تواصل معنا", id: "contact" },
|
||||
]}
|
||||
brandName="مساعدك الإلكتروني"
|
||||
/>
|
||||
@@ -54,273 +44,69 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{
|
||||
variant: "rotated-rays-animated-grid",
|
||||
}}
|
||||
background={{ variant: "rotated-rays-animated-grid" }}
|
||||
title="مساعدك الإلكتروني الذكي"
|
||||
description="حلول برمجية ذكية لترجمة وتطوير مهاراتك الدراسية وحل جميع استفساراتك اليومية بسرعة."
|
||||
carouselItems={[
|
||||
{
|
||||
id: "1",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/digital-world-map-hologram-blue-background_1379-900.jpg",
|
||||
imageAlt: "ai assistant tech abstract",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-tech-view-futuristic-earth_23-2151100372.jpg",
|
||||
imageAlt: "ai translation concept",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-portrait-young-girl-with-high-tech_23-2151133554.jpg",
|
||||
imageAlt: "smart education ai interface",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cyberpunk-illustration-with-neon-colors-futuristic-technology_23-2151672037.jpg",
|
||||
imageAlt: "ai brain reasoning tech",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/manager-wakes-up-employee-after-falling-asleep-table-desk_482257-77539.jpg",
|
||||
imageAlt: "tech startup office dark",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/african-american-staff-gathers-examines-monthly-revenue-balance_482257-130896.jpg",
|
||||
imageAlt: "analytical data dashboard",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "ابدأ الآن",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "تعرف على المزيد",
|
||||
href: "#about",
|
||||
},
|
||||
]}
|
||||
carouselItems={Array.from({length: 6}).map((_, i) => ({ id: `${i+1}`, imageSrc: "http://img.b2bpic.net/free-photo/digital-world-map-hologram-blue-background_1379-900.jpg" }))}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="لماذا مساعدك الإلكتروني؟"
|
||||
description="نقدم تقنيات الذكاء الاصطناعي الأحدث لضمان جودة عالية في التعليم والترجمة وحل المهام اليومية بكفاءة."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/industrial-designers-working-3d-model_23-2149370114.jpg"
|
||||
imageAlt="human ai synergy"
|
||||
/>
|
||||
<div id="character-arcs" data-section="character-arcs">
|
||||
<FeatureCardTwelve
|
||||
animationType="slide-up"
|
||||
title="تطور الشخصيات"
|
||||
description="تابع رحلة نمو الشخصيات الرئيسية عبر فصول القصة وتطوراتها النفسية."
|
||||
textboxLayout="split"
|
||||
features={[
|
||||
{ id: "c1", label: "الشخصية 1", title: "البطل", items: ["البداية في القرية", "مواجهة التحدي", "النضج الكامل"] },
|
||||
{ id: "c2", label: "الشخصية 2", title: "المساعد", items: ["دعم البطل", "اكتشاف القدرات", "الاستقلال الذاتي"] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="story-development" data-section="story-development">
|
||||
<TimelineProcessFlow
|
||||
title="مسار تطور القصة"
|
||||
description="أهم المحطات والتحولات في الحبكة الروائية والجانب الفلسفي."
|
||||
textboxLayout="split"
|
||||
animationType="slide-up"
|
||||
items={[
|
||||
{ content: "البداية والتمهيد", media: <Target className="w-12 h-12" />, reverse: false },
|
||||
{ content: "تصاعد الأحداث", media: <Zap className="w-12 h-12" />, reverse: true },
|
||||
{ content: "النهاية والنتائج", media: <Globe className="w-12 h-12" />, reverse: false }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwelve
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
label: "الترجمة",
|
||||
title: "ترجمة فورية",
|
||||
items: [
|
||||
"دعم لغات متعددة",
|
||||
"دقة لغوية عالية",
|
||||
"ترجمة الجمل المعقدة",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
label: "التعليم",
|
||||
title: "دعم تعليمي",
|
||||
items: [
|
||||
"شروحات مبسطة",
|
||||
"تلخيص المواد الدراسية",
|
||||
"دعم حل المسائل",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
label: "ذكاء",
|
||||
title: "حلول ذكية",
|
||||
items: [
|
||||
"إجابات دقيقة",
|
||||
"حل المشكلات المعقدة",
|
||||
"دعم فني على مدار الساعة",
|
||||
],
|
||||
},
|
||||
{ id: "f1", label: "الترجمة", title: "ترجمة فورية", items: ["دعم لغات متعددة", "دقة لغوية عالية"] },
|
||||
{ id: "f2", label: "التعليم", title: "دعم تعليمي", items: ["شروحات مبسطة", "تلخيص المواد"] },
|
||||
{ id: "f3", label: "ذكاء", title: "حلول ذكية", items: ["إجابات دقيقة", "حل المشكلات"] },
|
||||
]}
|
||||
title="خدماتنا الذكية"
|
||||
description="نحن هنا لتبسيط حياتك اليومية من خلال حلول تقنية متطورة."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
title: "مستخدم نشط",
|
||||
value: "50,000+",
|
||||
icon: Users,
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
title: "عملية ترجمة",
|
||||
value: "1M+",
|
||||
icon: Globe,
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
title: "استشارة تعليمية",
|
||||
value: "200k+",
|
||||
icon: BookOpen,
|
||||
},
|
||||
]}
|
||||
title="أرقامنا في سطور"
|
||||
description="نفتخر بما حققناه من إنجازات في خدمة آلاف المستخدمين يومياً."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFifteen
|
||||
useInvertedBackground={false}
|
||||
testimonial="لقد غير هذا الموقع أسلوبي الدراسي تماماً! المساعدة التعليمية دقيقة جداً ومفيدة."
|
||||
rating={5}
|
||||
author="سارة محمود"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-festive-plump-male-eyeglasses-bow-tie-dark-grey-background_613910-13747.jpg",
|
||||
alt: "Sarah",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/cheerful-businesswoman-with-hands-crossed_1098-20032.jpg",
|
||||
alt: "Ali",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/smiling-man_1098-15443.jpg",
|
||||
alt: "Omar",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-smiling-it-professional-silicon-valley-company-office-developing-software-apps-happy_482257-136225.jpg",
|
||||
alt: "Layla",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/studio-portrait-handsome-senior-man-using-tablet-with-headphones-dark-background_613910-38.jpg",
|
||||
alt: "Ahmed",
|
||||
},
|
||||
]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "هل الخدمة مجانية؟",
|
||||
content: "نعم، نقدم باقات مجانية ومدفوعة تناسب الجميع.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "كيف أبدأ؟",
|
||||
content: "فقط اضغط على زر ابدأ في أي خدمة وسنساعدك فوراً.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "هل البيانات آمنة؟",
|
||||
content: "نحن نطبق أعلى معايير الأمان لحماية خصوصيتك.",
|
||||
},
|
||||
{
|
||||
id: "q4",
|
||||
title: "ما هي اللغات المدعومة؟",
|
||||
content: "ندعم أكثر من 50 لغة عالمية بدقة عالية.",
|
||||
},
|
||||
{
|
||||
id: "q5",
|
||||
title: "هل هناك تطبيق للهاتف؟",
|
||||
content: "نعم، يمكنك الوصول لمساعدك عبر متصفح هاتفك أو تطبيقنا.",
|
||||
},
|
||||
]}
|
||||
title="الأسئلة الشائعة"
|
||||
description="كل ما تحتاج لمعرفته عن خدماتنا."
|
||||
faqsAnimation="slide-up"
|
||||
mediaAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/ai-cloud-concept-with-lit-brain_23-2149739755.jpg"
|
||||
imageAlt="Ai cloud concept with lit brain"
|
||||
description="نحن هنا لتبسيط حياتك اليومية."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="تواصل معنا"
|
||||
description="هل لديك استفسار آخر؟ أرسل لنا رسالة وسنرد عليك في أقرب وقت."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "الاسم الكامل",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "البريد الإلكتروني",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "رسالتك...",
|
||||
rows: 4,
|
||||
required: true,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/man-having-gaming-session-with-friends-communicating-online_482257-77061.jpg"
|
||||
imageAlt="digital communication office"
|
||||
description="هل لديك استفسار آخر؟ أرسل لنا رسالة."
|
||||
inputs={[{ name: "name", type: "text", placeholder: "الاسم الكامل" }, { name: "email", type: "email", placeholder: "البريد الإلكتروني" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "الرئيسية",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "الخدمات",
|
||||
href: "#features",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "الخصوصية",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "الشروط",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
columns={[{ items: [{ label: "الرئيسية", href: "#hero" }, { label: "الخدمات", href: "#features" }] }]}
|
||||
logoText="مساعدك الذكي"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user