Update src/app/page.tsx
This commit is contained in:
337
src/app/page.tsx
337
src/app/page.tsx
@@ -27,220 +27,143 @@ export default function LandingPage() {
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "الرئيسية",
|
||||
id: "home",
|
||||
},
|
||||
{
|
||||
name: "من نحن",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "خدماتنا",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "مشاريعنا",
|
||||
id: "projects",
|
||||
},
|
||||
{
|
||||
name: "اتصل بنا",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="شركة الأساس العريض للمقاولات"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "الرئيسية", id: "home" },
|
||||
{ name: "من نحن", id: "about" },
|
||||
{ name: "خدماتنا", id: "services" },
|
||||
{ name: "مشاريعنا", id: "projects" },
|
||||
{ name: "اتصل بنا", id: "contact" },
|
||||
]}
|
||||
brandName="شركة الأساس العريض للمقاولات"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="home" data-section="home">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="نبني المستقبل.. لأساسٍ عريض"
|
||||
description="شريكك الرائد في المقاولات والبنية التحتية في المملكة، نصنع التميز منذ 2004 بدقة متناهية وطموح يعانق الرؤية 2030."
|
||||
avatars={[
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8QPuiHapMltQpEaCiadHhovcl/aerial-view-of-modern-saudi-infrastructu-1774581512617-772fa861.png",
|
||||
alt: "construction",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "استعرض مشاريعنا",
|
||||
href: "#projects",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="home" data-section="home">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "gradient-bars"}}
|
||||
title="نبني المستقبل.. لأساسٍ عريض"
|
||||
description="شريكك الرائد في المقاولات والبنية التحتية في المملكة، نصنع التميز منذ 2004 بدقة متناهية وطموح يعانق الرؤية 2030."
|
||||
avatars={[
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8QPuiHapMltQpEaCiadHhovcl/aerial-view-of-modern-saudi-infrastructu-1774581512617-772fa861.png", alt: "construction"},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "استعرض مشاريعنا", href: "#projects"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={true}
|
||||
title="منذ 2004.. نصنع التغيير"
|
||||
description={[
|
||||
"تأسست شركة الأساس العريض لتكون علامة فارقة في قطاع المقاولات السعودي.",
|
||||
"أكثر من 2200 مشروع حكومي ناجح بامتياز.",
|
||||
"فخورون بحصولنا على جائزة الشريك الأول من الشركة السعودية للكهرباء.",
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={true}
|
||||
title="منذ 2004.. نصنع التغيير"
|
||||
description={[
|
||||
"تأسست شركة الأساس العريض لتكون علامة فارقة في قطاع المقاولات السعودي.", "أكثر من 2200 مشروع حكومي ناجح بامتياز.", "فخورون بحصولنا على جائزة الشريك الأول من الشركة السعودية للكهرباء."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureBento
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "إنشاءات عامة",
|
||||
description: "تنفيذ المشاريع الإنشائية بكفاءة هندسية عالية.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Building,
|
||||
},
|
||||
{
|
||||
title: "البنية التحتية",
|
||||
description: "تطوير الشبكات والأنظمة التحتية الأساسية.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Zap,
|
||||
},
|
||||
{
|
||||
title: "الكهروميكانيكا",
|
||||
description: "حلول كهربائية وميكانيكية متقدمة.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Settings,
|
||||
},
|
||||
{
|
||||
title: "أعمال الطرق",
|
||||
description: "بناء وتعبيد الطرق وفقاً لأعلى المقاييس.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Building2,
|
||||
},
|
||||
]}
|
||||
title="حلول متكاملة للبنية التحتية"
|
||||
description="نقدم نطاقاً واسعاً من الخدمات التخصصية بأعلى معايير الجودة العالمية."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureBento
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "إنشاءات عامة", description: "تنفيذ المشاريع الإنشائية بكفاءة هندسية عالية.", bentoComponent: "reveal-icon", icon: Building,
|
||||
},
|
||||
{
|
||||
title: "البنية التحتية", description: "تطوير الشبكات والأنظمة التحتية الأساسية.", bentoComponent: "reveal-icon", icon: Zap,
|
||||
},
|
||||
{
|
||||
title: "الكهروميكانيكا", description: "حلول كهربائية وميكانيكية متقدمة.", bentoComponent: "reveal-icon", icon: Settings,
|
||||
},
|
||||
{
|
||||
title: "أعمال الطرق", description: "بناء وتعبيد الطرق وفقاً لأعلى المقاييس.", bentoComponent: "reveal-icon", icon: Building2,
|
||||
},
|
||||
]}
|
||||
title="حلول متكاملة للبنية التحتية"
|
||||
description="نقدم نطاقاً واسعاً من الخدمات التخصصية بأعلى معايير الجودة العالمية."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardTen
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
title: "قيمة المشاريع",
|
||||
subtitle: "3.5+ مليار ريال",
|
||||
category: "النمو",
|
||||
value: "3.5B",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "المشاريع الحكومية",
|
||||
subtitle: "2,200+ مشروع",
|
||||
category: "التميز",
|
||||
value: "2200",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "فريق العمل",
|
||||
subtitle: "1,200+ موظف",
|
||||
category: "الخبرة",
|
||||
value: "1200",
|
||||
},
|
||||
]}
|
||||
title="أرقام تتحدث عن إنجازاتنا"
|
||||
description="ثقة عملائنا هي الوقود الذي يدفعنا للمزيد من النجاح."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardTen
|
||||
animationType="slide-up"
|
||||
textboxLayout="centered"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "1", title: "قيمة المشاريع", subtitle: "3.5+ مليار ريال", category: "النمو", value: "3.5B"},
|
||||
{
|
||||
id: "2", title: "المشاريع الحكومية", subtitle: "2,200+ مشروع", category: "التميز", value: "2200"},
|
||||
{
|
||||
id: "3", title: "فريق العمل", subtitle: "1,200+ موظف", category: "الخبرة", value: "1200"},
|
||||
]}
|
||||
title="أرقام تتحدث عن إنجازاتنا"
|
||||
description="ثقة عملائنا هي الوقود الذي يدفعنا للمزيد من النجاح."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="projects" data-section="projects">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "مشروع العقد الموحد",
|
||||
price: "400M SAR",
|
||||
variant: "Riyadh",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8QPuiHapMltQpEaCiadHhovcl/aerial-view-of-modern-saudi-infrastructu-1774581512617-772fa861.png?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "المسار الرياضي",
|
||||
price: "17M SAR",
|
||||
variant: "Riyadh",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8QPuiHapMltQpEaCiadHhovcl/aerial-view-of-modern-saudi-infrastructu-1774581512617-772fa861.png?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "مشروع الجنادرية",
|
||||
price: "12M SAR",
|
||||
variant: "Riyadh",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8QPuiHapMltQpEaCiadHhovcl/aerial-view-of-modern-saudi-infrastructu-1774581512617-772fa861.png?_wi=3",
|
||||
},
|
||||
]}
|
||||
title="معرض مشاريعنا"
|
||||
description="استكشف قائمة بمشاريعنا الكبرى التي ساهمت في نهضة الوطن."
|
||||
/>
|
||||
</div>
|
||||
<div id="projects" data-section="projects">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1", name: "مشروع العقد الموحد", price: "400M SAR", variant: "Riyadh", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8QPuiHapMltQpEaCiadHhovcl/aerial-view-of-modern-saudi-infrastructu-1774581512617-772fa861.png"},
|
||||
{
|
||||
id: "p2", name: "المسار الرياضي", price: "17M SAR", variant: "Riyadh", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8QPuiHapMltQpEaCiadHhovcl/aerial-view-of-modern-saudi-infrastructu-1774581512617-772fa861.png"},
|
||||
{
|
||||
id: "p3", name: "مشروع الجنادرية", price: "12M SAR", variant: "Riyadh", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B8QPuiHapMltQpEaCiadHhovcl/aerial-view-of-modern-saudi-infrastructu-1774581512617-772fa861.png"},
|
||||
]}
|
||||
title="معرض مشاريعنا"
|
||||
description="استكشف قائمة بمشاريعنا الكبرى التي ساهمت في نهضة الوطن."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
text="هل لديك مشروع طموح؟ نحن هنا لنجعل المستحيل واقعاً."
|
||||
buttons={[
|
||||
{
|
||||
text: "تواصل معنا الآن",
|
||||
href: "mailto:info@asas.sa",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "radial-gradient"}}
|
||||
text="هل لديك مشروع طموح؟ نحن هنا لنجعل المستحيل واقعاً."
|
||||
buttons={[
|
||||
{
|
||||
text: "تواصل معنا الآن", href: "mailto:info@asas.sa"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="الأساس العريض"
|
||||
columns={[
|
||||
{
|
||||
title: "خدماتنا",
|
||||
items: [
|
||||
{
|
||||
label: "البنية التحتية",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "المقاولات",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "عن الشركة",
|
||||
items: [
|
||||
{
|
||||
label: "رؤيتنا",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "الشهادات",
|
||||
href: "#iso",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 جميع الحقوق محفوظة لشركة الأساس العريض للمقاولات"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="الأساس العريض"
|
||||
columns={[
|
||||
{
|
||||
title: "خدماتنا", items: [
|
||||
{
|
||||
label: "البنية التحتية", href: "#services"},
|
||||
{
|
||||
label: "المقاولات", href: "#services"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "عن الشركة", items: [
|
||||
{
|
||||
label: "رؤيتنا", href: "#about"},
|
||||
{
|
||||
label: "الشهادات", href: "#iso"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 جميع الحقوق محفوظة لشركة الأساس العريض للمقاولات"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user