From 99a8971dce0cfc58b47dcbbe2fc7fc1f7ffd467c Mon Sep 17 00:00:00 2001 From: bender Date: Thu, 11 Jun 2026 06:52:50 +0000 Subject: [PATCH] Update src/app/page.tsx --- src/app/page.tsx | 262 +++++++++++------------------------------------ 1 file changed, 57 insertions(+), 205 deletions(-) diff --git a/src/app/page.tsx b/src/app/page.tsx index 5efb245..a35ad47 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -11,7 +11,7 @@ import MetricCardOne from '@/components/sections/metrics/MetricCardOne'; import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay'; import ProductCardOne from '@/components/sections/product/ProductCardOne'; import SplitAbout from '@/components/sections/about/SplitAbout'; -import { Clock, Cloud, Droplet, Gauge, Shield, ShieldCheck } from "lucide-react"; +import { Clock, Cloud, Shield, ShieldCheck, Speedometer, Fuel, Thermometer } from "lucide-react"; export default function LandingPage() { return ( @@ -21,8 +21,8 @@ export default function LandingPage() { borderRadius="soft" contentWidth="medium" sizing="mediumSizeLargeTitles" - background="fluid" - cardStyle="gradient-bordered" + background="noise" + cardStyle="gradient-mesh" primaryButtonStyle="flat" secondaryButtonStyle="glass" headingFontWeight="bold" @@ -32,33 +32,19 @@ export default function LandingPage() { @@ -70,13 +56,9 @@ export default function LandingPage() { description="Unlock unparalleled insights into your fleet with our cloud-based dashboard, powered by advanced AI and GCP for predictive maintenance and optimized driver behavior." buttons={[ { - text: "Get a Demo", - href: "#contact", - }, + text: "Get a Demo", href: "#contact"}, { - text: "Learn More", - href: "#about", - }, + text: "Learn More", href: "#about"}, ]} imageSrc="http://img.b2bpic.net/free-photo/close-up-modern-laptop-with-rate-charts-display-while-man-woman-working-business-project-design-computer-screen-with-data-chart-information-finance-analysis-desk_482257-40065.jpg" imageAlt="Connected-car cloud dashboard displaying vehicle telemetry" @@ -84,25 +66,15 @@ export default function LandingPage() { textPosition="bottom" avatars={[ { - src: "http://img.b2bpic.net/free-photo/close-up-accounting-sales-statistics-computer-display_482257-122982.jpg", - alt: "Close up of accounting sales statistics on computer display", - }, + src: "http://img.b2bpic.net/free-photo/close-up-accounting-sales-statistics-computer-display_482257-122982.jpg", alt: "Close up of accounting sales statistics on computer display"}, { - src: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169866.jpg", - alt: "Representation of user experience and interface design", - }, + src: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169866.jpg", alt: "Representation of user experience and interface design"}, { - src: "http://img.b2bpic.net/free-photo/closeup-african-american-entrepreneur-analyzing-company-profit_482257-20207.jpg", - alt: "Closeup of african american entrepreneur analyzing company profit", - }, + src: "http://img.b2bpic.net/free-photo/closeup-african-american-entrepreneur-analyzing-company-profit_482257-20207.jpg", alt: "Closeup of african american entrepreneur analyzing company profit"}, { - src: "http://img.b2bpic.net/free-photo/financial-program-user-interface-pc-screen-home-office-desk_482257-118861.jpg", - alt: "Financial program user interface on PC screen on home office desk", - }, + src: "http://img.b2bpic.net/free-photo/financial-program-user-interface-pc-screen-home-office-desk_482257-118861.jpg", alt: "Financial program user interface on PC screen on home office desk"}, { - src: "http://img.b2bpic.net/free-photo/hand-with-car-made-cloud_1134-148.jpg", - alt: "Hand with a car made of cloud", - }, + src: "http://img.b2bpic.net/free-photo/hand-with-car-made-cloud_1134-148.jpg", alt: "Hand with a car made of cloud"}, ]} avatarText="Trusted by leading automotive innovators" /> @@ -116,32 +88,16 @@ export default function LandingPage() { useInvertedBackground={true} metrics={[ { - id: "speed", - value: "75 MPH", - title: "Average Speed", - description: "Real-time average speed across your fleet for efficiency monitoring.", - icon: Gauge, + id: "speed", value: "75 MPH", title: "Average Speed", description: "Real-time average speed across your fleet for efficiency monitoring.", icon: Speedometer, }, { - id: "fuel", - value: "85%", - title: "Fuel Level", - description: "Instant overview of fuel levels to prevent unexpected stoppages.", - icon: Droplet, + id: "fuel", value: "85%", title: "Fuel Level", description: "Instant overview of fuel levels to prevent unexpected stoppages.", icon: Fuel, }, { - id: "engine-temp", - value: "90°C", - title: "Engine Temperature", - description: "Critical engine temperature monitoring to prevent overheating and damage.", - icon: Gauge, + id: "engine-temp", value: "90°C", title: "Engine Temperature", description: "Critical engine temperature monitoring to prevent overheating and damage.", icon: Thermometer, }, { - id: "health-score", - value: "9.2/10", - title: "Vehicle Health Score", - description: "An aggregated score reflecting overall vehicle health based on multiple parameters.", - icon: ShieldCheck, + id: "health-score", value: "9.2/10", title: "Vehicle Health Score", description: "An aggregated score reflecting overall vehicle health based on multiple parameters.", icon: ShieldCheck, }, ]} title="Key Performance Indicators" @@ -158,19 +114,13 @@ export default function LandingPage() { description="DriveInsight AI leverages Google Cloud Platform's robust infrastructure to deliver scalable, secure, and lightning-fast telemetry processing. Our platform is built for reliability and real-time data insights, ensuring your operations are always optimized." bulletPoints={[ { - title: "Scalable Infrastructure", - description: "Built on GCP to effortlessly handle data from thousands of vehicles.", - icon: Cloud, + title: "Scalable Infrastructure", description: "Built on GCP to effortlessly handle data from thousands of vehicles.", icon: Cloud, }, { - title: "Enterprise-Grade Security", - description: "Your data is protected with industry-leading encryption and compliance.", - icon: Shield, + title: "Enterprise-Grade Security", description: "Your data is protected with industry-leading encryption and compliance.", icon: Shield, }, { - title: "Real-Time Processing", - description: "Instant data ingestion and analysis for immediate insights and actions.", - icon: Clock, + title: "Real-Time Processing", description: "Instant data ingestion and analysis for immediate insights and actions.", icon: Clock, }, ]} imageSrc="http://img.b2bpic.net/free-photo/online-car-insurance-application_53876-167062.jpg" @@ -186,34 +136,16 @@ export default function LandingPage() { useInvertedBackground={true} features={[ { - id: "real-time-telemetry", - label: "Live Data Feeds", - title: "Real-Time Telemetry Panel", - items: [ - "Instant data updates from all connected vehicles.", - "Customizable dashboard views for key metrics.", - "High-frequency data streaming for granular analysis.", - ], + id: "real-time-telemetry", label: "Live Data Feeds", title: "Real-Time Telemetry Panel", items: [ + "Instant data updates from all connected vehicles.", "Customizable dashboard views for key metrics.", "High-frequency data streaming for granular analysis."], }, { - id: "active-alerts", - label: "Event Notifications", - title: "Active Alerts & Notifications", - items: [ - "Configurable alert thresholds for critical parameters.", - "Instant notifications via email, SMS, or in-app.", - "Detailed event logs for post-incident analysis.", - ], + id: "active-alerts", label: "Event Notifications", title: "Active Alerts & Notifications", items: [ + "Configurable alert thresholds for critical parameters.", "Instant notifications via email, SMS, or in-app.", "Detailed event logs for post-incident analysis."], }, { - id: "vehicle-health", - label: "Diagnostic Charts", - title: "Vehicle Health Charts", - items: [ - "Trend analysis for engine parameters and system health.", - "Visual representation of diagnostic trouble codes.", - "Proactive identification of potential maintenance needs.", - ], + id: "vehicle-health", label: "Diagnostic Charts", title: "Vehicle Health Charts", items: [ + "Trend analysis for engine parameters and system health.", "Visual representation of diagnostic trouble codes.", "Proactive identification of potential maintenance needs."], }, ]} title="Comprehensive Telemetry & Alerting" @@ -229,47 +161,17 @@ export default function LandingPage() { useInvertedBackground={false} products={[ { - id: "map-1", - name: "Live Vehicle Tracking", - price: "GPS", - imageSrc: "http://img.b2bpic.net/free-photo/abstract-geometric-wavy-folds-background_1048-16955.jpg", - imageAlt: "Live vehicle tracking map", - }, + id: "map-1", name: "Live Vehicle Tracking", price: "GPS", imageSrc: "http://img.b2bpic.net/free-photo/abstract-geometric-wavy-folds-background_1048-16955.jpg", imageAlt: "Live vehicle tracking map"}, { - id: "map-2", - name: "Fleet Overview", - price: "Multi-Vehicle", - imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-truck-boxes_23-2149853131.jpg", - imageAlt: "Multi-vehicle fleet overview map", - }, + id: "map-2", name: "Fleet Overview", price: "Multi-Vehicle", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-truck-boxes_23-2149853131.jpg", imageAlt: "Multi-vehicle fleet overview map"}, { - id: "map-3", - name: "Route Optimization", - price: "Efficiency", - imageSrc: "http://img.b2bpic.net/free-photo/map-car_1160-57.jpg", - imageAlt: "Route optimization map", - }, + id: "map-3", name: "Route Optimization", price: "Efficiency", imageSrc: "http://img.b2bpic.net/free-photo/map-car_1160-57.jpg", imageAlt: "Route optimization map"}, { - id: "map-4", - name: "Historical Journeys", - price: "Playback", - imageSrc: "http://img.b2bpic.net/free-photo/speed-neon-lights-city_23-2149552524.jpg", - imageAlt: "Historical journey map", - }, + id: "map-4", name: "Historical Journeys", price: "Playback", imageSrc: "http://img.b2bpic.net/free-photo/speed-neon-lights-city_23-2149552524.jpg", imageAlt: "Historical journey map"}, { - id: "map-5", - name: "Geo-Fencing Alerts", - price: "Boundaries", - imageSrc: "http://img.b2bpic.net/free-photo/still-life-supply-chain-representation_23-2149827294.jpg", - imageAlt: "Geo-fencing map with alerts", - }, + id: "map-5", name: "Geo-Fencing Alerts", price: "Boundaries", imageSrc: "http://img.b2bpic.net/free-photo/still-life-supply-chain-representation_23-2149827294.jpg", imageAlt: "Geo-fencing map with alerts"}, { - id: "map-6", - name: "Combined View", - price: "Live + Map", - imageSrc: "http://img.b2bpic.net/free-photo/focused-videographer-producer-working-movie-production-editing-film-design_482257-19397.jpg", - imageAlt: "Split view of live feed and map", - }, + id: "map-6", name: "Combined View", price: "Live + Map", imageSrc: "http://img.b2bpic.net/free-photo/focused-videographer-producer-working-movie-production-editing-film-design_482257-19397.jpg", imageAlt: "Split view of live feed and map"}, ]} title="Dynamic Vehicle Location & Route Optimization" description="Track your fleet in real-time on an interactive map, visualize routes, and optimize logistics with our intuitive mapping solution." @@ -283,34 +185,16 @@ export default function LandingPage() { useInvertedBackground={true} features={[ { - id: "predictive-maintenance", - label: "AI-Driven Forecasts", - title: "Predictive Insights Section", - items: [ - "AI algorithms predict component failures before they occur.", - "Schedule maintenance proactively to minimize downtime.", - "Reduce operational costs through optimized service intervals.", - ], + id: "predictive-maintenance", label: "AI-Driven Forecasts", title: "Predictive Insights Section", items: [ + "AI algorithms predict component failures before they occur.", "Schedule maintenance proactively to minimize downtime.", "Reduce operational costs through optimized service intervals."], }, { - id: "driver-behavior", - label: "Performance Analysis", - title: "Driver Behavior Analytics Charts", - items: [ - "Monitor harsh braking, acceleration, and cornering.", - "Identify unsafe driving patterns and provide coaching.", - "Improve fuel efficiency through better driving habits.", - ], + id: "driver-behavior", label: "Performance Analysis", title: "Driver Behavior Analytics Charts", items: [ + "Monitor harsh braking, acceleration, and cornering.", "Identify unsafe driving patterns and provide coaching.", "Improve fuel efficiency through better driving habits."], }, { - id: "performance-benchmarking", - label: "Fleet Comparison", - title: "Fleet Performance Benchmarking", - items: [ - "Compare vehicle and driver performance against benchmarks.", - "Identify top performers and areas for improvement.", - "Drive continuous improvement across your entire fleet.", - ], + id: "performance-benchmarking", label: "Fleet Comparison", title: "Fleet Performance Benchmarking", items: [ + "Compare vehicle and driver performance against benchmarks.", "Identify top performers and areas for improvement.", "Drive continuous improvement across your entire fleet."], }, ]} title="Advanced Analytics for Proactive Decisions" @@ -323,20 +207,11 @@ export default function LandingPage() { useInvertedBackground={false} faqs={[ { - id: "faq-1", - title: "What kind of vehicles does DriveInsight AI support?", - content: "DriveInsight AI is designed to support a wide range of vehicles, from commercial trucks and delivery vans to passenger fleets. Our platform is hardware-agnostic and can integrate with various telematics devices.", - }, + id: "faq-1", title: "What kind of vehicles does DriveInsight AI support?", content: "DriveInsight AI is designed to support a wide range of vehicles, from commercial trucks and delivery vans to passenger fleets. Our platform is hardware-agnostic and can integrate with various telematics devices."}, { - id: "faq-2", - title: "How does your platform ensure data security?", - content: "We leverage Google Cloud Platform's robust security features, including end-to-end encryption, identity and access management, and continuous security monitoring, to ensure your data is always protected and compliant with industry standards.", - }, + id: "faq-2", title: "How does your platform ensure data security?", content: "We leverage Google Cloud Platform's robust security features, including end-to-end encryption, identity and access management, and continuous security monitoring, to ensure your data is always protected and compliant with industry standards."}, { - id: "faq-3", - title: "Can I customize the dashboard to my specific needs?", - content: "Yes, DriveInsight AI offers highly customizable dashboards. You can select which KPIs to display, configure alert thresholds, and create personalized reports to match your operational requirements.", - }, + id: "faq-3", title: "Can I customize the dashboard to my specific needs?", content: "Yes, DriveInsight AI offers highly customizable dashboards. You can select which KPIs to display, configure alert thresholds, and create personalized reports to match your operational requirements."}, ]} sideTitle="Frequently Asked Questions" sideDescription="Find quick answers to the most common questions about DriveInsight AI and our Vehicle Telemetry Platform." @@ -350,8 +225,7 @@ export default function LandingPage() {