Update src/app/page.tsx

src/app/page.tsx

@@ -2,13 +2,14 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
+import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
-import FooterBase from '@/components/sections/footer/FooterBase';
+import FooterCard from '@/components/sections/footer/FooterCard';
-import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
+import HeroLogo from '@/components/sections/hero/HeroLogo';
-import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
+import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
-import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
-import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
+import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
-import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
+import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
+import { BrainCircuit, Cpu, Zap, Target } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -26,164 +27,83 @@ export default function LandingPage() {
     >
       <ReactLenis root>
   <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingInline
+      <NavbarStyleCentered
       navItems={[
-        {
+        { name: "Home", id: "hero" },
-          name: "Home",
+        { name: "Architecture", id: "architecture" },
-          id: "hero",
+        { name: "Metrics", id: "metrics" },
-        },
+        { name: "Features", id: "features" },
-        {
-          name: "Architecture",
-          id: "architecture",
-        },
-        {
-          name: "Metrics",
-          id: "metrics",
-        },
-        {
-          name: "Features",
-          id: "features",
-        },
       ]}
       brandName="RAS Scheduler"
-      button={{
+      button={{ text: "Get Started" }}
-        text: "Get Started",
-      }}
     />
   </div>
 
   <div id="hero" data-section="hero">
-      <HeroBillboardScroll
+      <HeroLogo
-      background={{
+      logoText="RAS Scheduler"
-        variant: "gradient-bars",
-      }}
-      title="Optimizing Resources Through Smart Scheduling"
       description="A sophisticated system designed to efficiently allocate resources by evaluating task requirements, priorities, and system constraints to minimize idle time."
+      buttons={[{ text: "Get Started", href: "#metrics" }]}
       imageSrc="http://img.b2bpic.net/free-photo/business-chart-visual-graphics-report-concept_53876-167093.jpg"
-      imageAlt="Resource Allocation Dashboard UI"
-      buttons={[
-        {
-          text: "Get Started",
-          href: "#metrics",
-        },
-      ]}
     />
   </div>
 
   <div id="architecture" data-section="architecture">
-      <TextSplitAbout
+      <InlineImageSplitTextAbout
+      heading={[{ type: "text", content: "System Architecture & Flow" }]}
+      buttons={[{ text: "Learn More" }]}
       useInvertedBackground={false}
-      title="System Architecture & Flow"
-      description={[
-        "Our system architecture consists of five core layers: User Input, Preprocessing, Resource Pool, Scheduling Engine, and Visualization.",
-        "This modular design ensures that task requirements are validated, resource status is tracked in real-time, and algorithms are applied to ensure optimal allocation efficiency.",
-      ]}
     />
   </div>
 
   <div id="metrics" data-section="metrics">
-      <MetricCardFourteen
+      <MetricCardOne
-      useInvertedBackground={true}
       title="Real-time Resource Distribution"
-      tag="Efficiency Metrics"
+      gridVariant="uniform-all-items-equal"
+      animationType="slide-up"
+      textboxLayout="split"
+      description="Key performance indicators for resource management."
+      useInvertedBackground={false}
       metrics={[
-        {
+        { id: "m1", value: "60%", title: "CPU Utilization", description: "Average usage", icon: Cpu },
-          id: "m1",
+        { id: "m2", value: "70%", title: "Memory Allocation", description: "Available capacity", icon: BrainCircuit },
-          value: "60%",
+        { id: "m3", value: "80%", title: "Manpower Efficiency", description: "Team output", icon: Target },
-          description: "CPU Utilization",
+        { id: "m4", value: "90%", title: "Storage Capacity", description: "Total volume", icon: Zap },
-        },
-        {
-          id: "m2",
-          value: "70%",
-          description: "Memory Allocation",
-        },
-        {
-          id: "m3",
-          value: "80%",
-          description: "Manpower Efficiency",
-        },
-        {
-          id: "m4",
-          value: "90%",
-          description: "Storage Capacity",
-        },
       ]}
-      metricsAnimation="slide-up"
     />
   </div>
 
   <div id="features" data-section="features">
-      <FeatureCardTwentyNine
+      <FeatureCardTwentyThree
       animationType="slide-up"
+      title="Key Features"
       textboxLayout="split"
-      gridVariant="three-columns-all-equal-width"
+      description="Advanced capabilities for resource optimization."
       useInvertedBackground={false}
       features={[
-        {
+        { id: "f1", title: "Priority Allocation", tags: ["Strategy"], imageSrc: "http://img.b2bpic.net/free-vector/online-marketing-sticker-set_534985-34.jpg" },
-          title: "Priority Allocation",
+        { id: "f2", title: "Idle Time Reduction", tags: ["Efficiency"], imageSrc: "http://img.b2bpic.net/free-photo/high-angle-notebook-clock-arrangement_23-2149320924.jpg" },
-          description: "Automated scheduling based on task urgency and system availability.",
+        { id: "f3", title: "System Scalability", tags: ["Growth"], imageSrc: "http://img.b2bpic.net/free-photo/top-view-office-supplies_171337-13070.jpg" },
-          imageSrc: "http://img.b2bpic.net/free-vector/online-marketing-sticker-set_534985-34.jpg",
-          titleIconSrc: "http://img.b2bpic.net/free-vector/online-marketing-sticker-set_534985-34.jpg",
-          buttonText: "View Strategy",
-        },
-        {
-          title: "Idle Time Reduction",
-          description: "Minimize waste by balanced resource distribution across all modules.",
-          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-notebook-clock-arrangement_23-2149320924.jpg",
-          titleIconSrc: "http://img.b2bpic.net/free-photo/high-angle-notebook-clock-arrangement_23-2149320924.jpg",
-          buttonText: "Check Efficiency",
-        },
-        {
-          title: "System Scalability",
-          description: "Dynamic adaptation to changing project demands and task counts.",
-          imageSrc: "http://img.b2bpic.net/free-photo/top-view-office-supplies_171337-13070.jpg",
-          titleIconSrc: "http://img.b2bpic.net/free-photo/top-view-office-supplies_171337-13070.jpg",
-          buttonText: "Explore",
-        },
       ]}
-      title="Key Features"
-      description="Powerful capabilities to solve your resource scheduling challenges."
     />
   </div>
 
   <div id="socialProof" data-section="socialProof">
-      <SocialProofOne
+      <TestimonialCardSix
+      title="Client Feedback"
+      animationType="slide-up"
       textboxLayout="default"
+      description="What our partners say about us."
       useInvertedBackground={false}
-      title="Trusted by Industry Leaders"
+      testimonials={[
-      description="Join companies optimizing their project management workflow with our scheduler."
+        { id: "t1", name: "TechFlow Inc", handle: "@techflow", testimonial: "The resource allocation has significantly improved our project delivery timelines." },
-      tag="Partnerships"
+        { id: "t2", name: "DataBridge", handle: "@databridge", testimonial: "A robust and reliable system that fits perfectly into our infrastructure." },
-      names={[
-        "TechFlow",
-        "DataBridge",
-        "CloudCore",
-        "SyncroSystems",
-        "VertexSolutions",
       ]}
     />
   </div>
 
   <div id="footer" data-section="footer">
-      <FooterBase
+      <FooterCard
-      columns={[
-        {
-          title: "Documentation",
-          items: [
-            {
-              label: "Abstract",
-              href: "#",
-            },
-            {
-              label: "Architecture",
-              href: "#architecture",
-            },
-            {
-              label: "Results",
-              href: "#",
-            },
-          ],
-        },
-      ]}
       logoText="RAS Project"
       copyrightText="© 2025 Resource Management Team"
     />