164 lines
7.0 KiB
TypeScript
164 lines
7.0 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
|
import TextAbout from '@/components/sections/about/TextAbout';
|
|
import { Activity, BookOpen, MessageSquare, Sparkles } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-shift"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="rounded"
|
|
contentWidth="medium"
|
|
sizing="medium"
|
|
background="circleGradient"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="normal"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "hero"},
|
|
{
|
|
name: "About", id: "about"},
|
|
{
|
|
name: "Methodology", id: "methodology"},
|
|
{
|
|
name: "Prediction", id: "prediction"},
|
|
]}
|
|
brandName="ML Predictor"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitDualMedia
|
|
background={{
|
|
variant: "plain"}}
|
|
title="Predict Diabetes Risk Using Machine Learning"
|
|
description="Early detection is critical. Leverage our intelligent, data-driven system built on the Pima Indian Diabetes Dataset to assess potential health risks with high accuracy."
|
|
tag="Advanced Healthcare AI"
|
|
mediaItems={[
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/empty-medical-cabinet-private-clinic-with-laptop-diagnostics_482257-122738.jpg", imageAlt: "AI Diabetes Analysis"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/healthcare-provider-presenting-lab-test-results-patient-cabinet_482257-124790.jpg", imageAlt: "Health Data Analysis"}
|
|
]}
|
|
mediaAnimation="slide-up"
|
|
rating={5}
|
|
ratingText="Trusted by Researchers"
|
|
tagIcon={Sparkles}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TextAbout
|
|
useInvertedBackground={false}
|
|
tag="About the Project"
|
|
title="Understanding the Pima Indian Diabetes Dataset"
|
|
tagIcon={BookOpen}
|
|
buttons={[
|
|
{
|
|
text: "View Methodology", href: "#methodology"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="methodology" data-section="methodology">
|
|
<FeatureCardTwentyThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{
|
|
id: "f1", title: "Data Preprocessing", tags: [
|
|
"Cleaning", "Standardization"],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/empty-medical-cabinet-private-clinic-with-laptop-diagnostics_482257-122738.jpg", imageAlt: "Processing"},
|
|
{
|
|
id: "f2", title: "Algorithm Selection", tags: [
|
|
"Logistic Regression", "Forest"],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/healthcare-provider-presenting-lab-test-results-patient-cabinet_482257-124790.jpg", imageAlt: "Model"},
|
|
{
|
|
id: "f3", title: "Metric Analysis", tags: [
|
|
"Accuracy", "Recall"],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/empty-medical-cabinet-private-clinic-with-laptop-diagnostics_482257-122738.jpg", imageAlt: "Results"},
|
|
]}
|
|
title="Our ML Methodology"
|
|
description="Leveraging advanced algorithms to deliver precise, actionable insights."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonial" data-section="testimonial">
|
|
<TestimonialCardTen
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
title="What Our Users Say"
|
|
description="Join researchers and health professionals who rely on our prediction models for preliminary screening."
|
|
tag="Testimonials"
|
|
tagIcon={MessageSquare}
|
|
testimonials={[
|
|
{
|
|
id: "t1", title: "Highly Accurate", quote: "The prediction accuracy is consistently reliable for my preliminary screening workflow.", name: "Dr. Sarah Jenkins", role: "General Practitioner", imageSrc: "http://img.b2bpic.net/free-photo/healthcare-provider-presenting-lab-test-results-patient-cabinet_482257-124790.jpg"},
|
|
{
|
|
id: "t2", title: "User-Friendly", quote: "Very easy to integrate into my research data analysis pipeline.", name: "Mark Vane", role: "Data Analyst", imageSrc: "http://img.b2bpic.net/free-photo/empty-medical-cabinet-private-clinic-with-laptop-diagnostics_482257-122738.jpg"},
|
|
{
|
|
id: "t3", title: "Fast Results", quote: "Provides instant insights that help prioritize patient care.", name: "Elena Rodriguez", role: "Medical Researcher", imageSrc: "http://img.b2bpic.net/free-photo/healthcare-provider-presenting-lab-test-results-patient-cabinet_482257-124790.jpg"},
|
|
{
|
|
id: "t4", title: "Essential Tool", quote: "This tool has significantly improved our early detection screening efficiency.", name: "Thomas Wong", role: "Health Administrator", imageSrc: "http://img.b2bpic.net/free-photo/empty-medical-cabinet-private-clinic-with-laptop-diagnostics_482257-122738.jpg"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="prediction" data-section="prediction">
|
|
<ContactCenter
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "plain"}}
|
|
tag="Risk Assessment"
|
|
title="Predict Diabetes Risk"
|
|
description="Enter your health metrics to receive a probability-based risk assessment."
|
|
buttonText="Predict Risk"
|
|
tagIcon={Activity}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
imageSrc="http://img.b2bpic.net/free-photo/big-abstract-bubble-texture_23-2148205028.jpg"
|
|
logoText="ML Predictor"
|
|
columns={[
|
|
{
|
|
title: "Developer", items: [
|
|
{
|
|
label: "GitHub Profile", href: "#"},
|
|
{
|
|
label: "Email Contact", href: "mailto:dev@example.com"},
|
|
],
|
|
},
|
|
{
|
|
title: "Learn", items: [
|
|
{
|
|
label: "Dataset Docs", href: "#"},
|
|
{
|
|
label: "Methodology", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|