Merge version_2 into main #3
273
src/app/page.tsx
273
src/app/page.tsx
@@ -4,197 +4,116 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
||||
import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
|
||||
import FooterBase from '@/components/sections/footer/FooterBase';
|
||||
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import HeroLogo from '@/components/sections/hero/HeroLogo';
|
||||
import SplitAbout from '@/components/sections/about/SplitAbout';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
import { BarChart2, Shield, Zap } from "lucide-react";
|
||||
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
||||
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
||||
import { Shield, Sparkles, Smile, Star } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-shift"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="pill"
|
||||
contentWidth="small"
|
||||
sizing="mediumLargeSizeLargeTitles"
|
||||
background="circleGradient"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="extrabold"
|
||||
defaultButtonVariant="hover-bubble"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="soft"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="none"
|
||||
cardStyle="glass-depth"
|
||||
primaryButtonStyle="flat"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Team", id: "team" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="AI Startup"
|
||||
button={{ text: "Start Free Trial", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="U Dent"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Artificial Intelligence, Simplified"
|
||||
description="Unlock smarter workflows with AI built for teams. No complexity. No code required."
|
||||
buttons={[{ text: "Start Free Trial", href: "#contact" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/3d-render-modern-network-communications-background-with-low-poly-design_1048-15565.jpg", imageAlt: "abstract digital network lines" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/abstract-network-interconnected-nodes-lines-black-background_23-2151977502.jpg", imageAlt: "futuristic neural network digital" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/laptop-bowl_23-2147982605.jpg", imageAlt: "software UI interface conceptual" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/modern-close-up-ferromagnetic-metal_23-2148253626.jpg", imageAlt: "silicon chip glowing pathway" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/3d-view-puzzle-pieces_23-2150499115.jpg", imageAlt: "abstract machine learning geometry" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/aerial-view-shanghai-overpass-night_1359-1074.jpg", imageAlt: "cloud computing network nodes" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogo
|
||||
logoText="U Dent"
|
||||
description="Luxury dental care and precision implant dentistry. Where world-class medical excellence meets a serene patient experience."
|
||||
buttons={[{ text: "Book Consultation", href: "#contact" }]}
|
||||
imageSrc="https://img.b2bpic.net/free-photo/dentist-with-patient-dental-clinic_1303-30514.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={true}
|
||||
title="Built for High-Performance Teams"
|
||||
description="Our AI integrates seamlessly with your existing tech stack, automating repetitive tasks so you can focus on building the future. We empower teams to achieve more with less friction."
|
||||
metrics={[
|
||||
{ value: "40%", title: "Workflow efficiency gain" },
|
||||
{ value: "10k+", title: "Daily automated tasks" },
|
||||
{ value: "24/7", title: "Continuous integration" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/waiting-area-hotel-blur_1203-1405.jpg"
|
||||
imageAlt="modern office environment blur"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
title="Excellence in Every Smile"
|
||||
description="At U Dent, we combine state-of-the-art implant technology with a holistic approach to oral health, ensuring results that are as functional as they are beautiful."
|
||||
bulletPoints={[
|
||||
{ title: "Advanced Implantology", description: "Precision guided implants for long-term comfort.", icon: Shield },
|
||||
{ title: "Holistic Care", description: "Tailored treatment plans for your unique health.", icon: Smile },
|
||||
{ title: "Luxury Atmosphere", description: "Designed for complete relaxation and peace.", icon: Sparkles }
|
||||
]}
|
||||
imageSrc="https://img.b2bpic.net/free-photo/modern-dental-clinic-office_1268-23267.jpg"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Smart Automation", description: "Trigger complex workflows with simple commands.", icon: Zap,
|
||||
mediaItems: [
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/3d-rendered-blue-menu-icon-within-circle_187299-47754.jpg", imageAlt: "3d automation icon minimal" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-vector/artificial-intelligence-elements-collection-flat-style_23-2147869043.jpg", imageAlt: "3d automation icon minimal" },
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Real-time Insights", description: "Make data-driven decisions with built-in analytics.", icon: BarChart2,
|
||||
mediaItems: [
|
||||
{ imageSrc: "http://img.b2bpic.net/free-vector/20-data-science-cyber-security-flat-color-icon-pack-like-data-info-measure-diary-phone_1142-17112.jpg", imageAlt: "minimal digital chart icon" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-vector/linear-graphs-charts-diagrams_1257-356.jpg", imageAlt: "minimal digital chart icon" },
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Secure Infrastructure", description: "Enterprise-grade protection for your sensitive data.", icon: Shield,
|
||||
mediaItems: [
|
||||
{ imageSrc: "http://img.b2bpic.net/free-vector/hacker-flat-icons-badges-colorful-circles-white-background-vector-illustration_1284-41476.jpg", imageAlt: "minimal tech shield icon" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/cybersecurity-concept-shield-protecting-data_23-2152001124.jpg", imageAlt: "minimal tech shield icon" },
|
||||
]
|
||||
},
|
||||
]}
|
||||
title="Features That Drive Success"
|
||||
description="Everything your team needs to scale smarter, faster."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTwentyNine
|
||||
title="Our Specialized Services"
|
||||
description="Comprehensive solutions delivered with artisan precision."
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
features={[
|
||||
{ title: "Implant Dentistry", description: "Natural look and feel.", imageSrc: "https://img.b2bpic.net/free-photo/dentist-tools_1268-23267.jpg", titleImageSrc: "https://img.b2bpic.net/free-vector/tooth-icon_23-2148123456.jpg", buttonText: "Learn More" },
|
||||
{ title: "Cosmetic Design", description: "Custom smile transformations.", imageSrc: "https://img.b2bpic.net/free-photo/dentist-examining-patient_1268-23267.jpg", titleImageSrc: "https://img.b2bpic.net/free-vector/star-icon_23-2148123456.jpg", buttonText: "Learn More" },
|
||||
{ title: "Oral Surgery", description: "Minimal trauma, faster recovery.", imageSrc: "https://img.b2bpic.net/free-photo/doctor-preparing-tools_1268-23267.jpg", titleImageSrc: "https://img.b2bpic.net/free-vector/shield-icon_23-2148123456.jpg", buttonText: "Learn More" }
|
||||
]}
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{ id: "p1", brand: "Module", name: "Deep Analytics", price: "Custom", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-vector/collection-green-blue-infographic-elements_23-2147610425.jpg" },
|
||||
{ id: "p2", brand: "Module", name: "Content Generator", price: "Custom", rating: 4, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-vector/flat-design-electronics-logo-templates_23-2148985012.jpg" },
|
||||
{ id: "p3", brand: "Module", name: "Workflow Sync", price: "Custom", rating: 5, reviewCount: "200", imageSrc: "http://img.b2bpic.net/free-vector/protect-against-cyber-attacks-infographic_23-2148527824.jpg" },
|
||||
{ id: "p4", brand: "Module", name: "Predictive AI", price: "Custom", rating: 4, reviewCount: "95", imageSrc: "http://img.b2bpic.net/free-vector/illustration-data-analysis-graph_53876-5866.jpg" },
|
||||
{ id: "p5", brand: "Module", name: "Admin Control", price: "Custom", rating: 5, reviewCount: "110", imageSrc: "http://img.b2bpic.net/free-photo/view-puzzle-pieces-blue-background_23-2149299057.jpg" },
|
||||
{ id: "p6", brand: "Module", name: "Team Brain", price: "Custom", rating: 5, reviewCount: "340", imageSrc: "http://img.b2bpic.net/free-vector/shield-teamwork-protect-defense-logo-linear-style_126523-2745.jpg" },
|
||||
]}
|
||||
title="Our AI Modules"
|
||||
description="Specialized tools designed for specific business challenges."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
title="Patient Journeys"
|
||||
description="Experience the U Dent difference through the voices of those we've helped."
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
testimonials={[
|
||||
{ id: "1", name: "Alex Rivers", role: "Design Director", company: "Creative Co", rating: 5, imageSrc: "https://img.b2bpic.net/free-photo/man-smiling-brightly_1145-1234.jpg" },
|
||||
{ id: "2", name: "Sophia Chen", role: "Architect", company: "Studio One", rating: 5, imageSrc: "https://img.b2bpic.net/free-photo/woman-smiling-happy_1145-5678.jpg" }
|
||||
]}
|
||||
textboxLayout="split"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social" data-section="social">
|
||||
<SocialProofOne
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
names={["Google", "Microsoft", "Amazon", "Apple", "Tesla", "Meta", "Nvidia"]}
|
||||
title="Trusted by Industry Leaders"
|
||||
description="Join companies optimizing their future with AI."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
tag="Contact"
|
||||
title="Begin Your Transformation"
|
||||
description="Schedule your private consultation today and meet our team of experts."
|
||||
background={{ variant: "plain" }}
|
||||
imageSrc="https://img.b2bpic.net/free-photo/reception-desk-dental-clinic_1268-23267.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Johnson", date: "2024-01-10", title: "CEO, TechCorp", quote: "Incredible impact on our workflow speed.", tag: "Enterprise", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67170.jpg" },
|
||||
{ id: "2", name: "Michael Chen", date: "2024-02-15", title: "CTO, Labs", quote: "The API documentation is world-class.", tag: "Dev", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-pretty-mulatto-woman-with-trendy-make-up-standing-with-arms-crossed-office-indoor-photo-female-black-employee-posing-with-international-colleagues-gently-smile_197531-3788.jpg" },
|
||||
{ id: "3", name: "Emily Rodriguez", date: "2024-03-20", title: "Marketing Director", quote: "I saved 10 hours a week using the tool.", tag: "Business", avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-sitting-chair_23-2149213192.jpg" },
|
||||
{ id: "4", name: "David Kim", date: "2024-04-05", title: "Founder, XYZ", quote: "Fast integration, immediate ROI results.", tag: "Startup", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg" },
|
||||
{ id: "5", name: "Jane Doe", date: "2024-05-12", title: "PM, GrowthCo", quote: "Invaluable asset to our design operations.", tag: "Product", avatarSrc: "http://img.b2bpic.net/free-photo/business-man-working-late-office_23-2148991382.jpg" },
|
||||
]}
|
||||
title="What Our Partners Say"
|
||||
description="Real results from real teams using our platform daily."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "f1", title: "Is technical knowledge required?", content: "No, our interface is designed for teams of all technical levels." },
|
||||
{ id: "f2", title: "Can I integrate with my existing stack?", content: "Absolutely, we support hundreds of common business integrations." },
|
||||
{ id: "f3", title: "How secure is my data?", content: "Your security is our priority. We use industry-standard encryption." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/robots-love-valentine-s-day-celebration_23-2151932789.jpg"
|
||||
title="Frequently Asked Questions"
|
||||
description="Find answers to common questions about our platform."
|
||||
faqsAnimation="slide-up"
|
||||
imageAlt="minimalist 3d help icon"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={true}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
tag="Get Started"
|
||||
title="Ready to Start?"
|
||||
description="Unlock smarter workflows today. No complexity."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/connecting-dots-background-network-communication-design_53876-160215.jpg"
|
||||
inputPlaceholder="Enter your work email"
|
||||
buttonText="Get Access"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{ title: "Product", items: [{ label: "Features", href: "#features" }, { label: "Modules", href: "#products" }] },
|
||||
{ title: "Company", items: [{ label: "About", href: "#about" }, { label: "Contact", href: "#contact" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy", href: "#" }, { label: "Terms", href: "#" }] },
|
||||
]}
|
||||
logoText="AI Startup"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{ title: "Clinic", items: [{ label: "Location", href: "#" }, { label: "Careers", href: "#" }] },
|
||||
{ title: "Services", items: [{ label: "Implants", href: "#services" }, { label: "Aesthetics", href: "#services" }] },
|
||||
{ title: "Support", items: [{ label: "Privacy Policy", href: "#" }] }
|
||||
]}
|
||||
logoText="U Dent"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #ffffffe6;
|
||||
--primary-cta: #e6e6e6;
|
||||
--background: #ffffff;
|
||||
--card: #fbfbfb;
|
||||
--foreground: #1f2937;
|
||||
--primary-cta: #1f3a5f;
|
||||
--primary-cta-text: #0a0a0a;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta: #d4af37;
|
||||
--secondary-cta-text: #ffffffe6;
|
||||
--accent: #737373;
|
||||
--background-accent: #737373;
|
||||
--accent: #d4af37;
|
||||
--background-accent: #f3f4f6;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user