Files
fa266c67-8ed7-459a-8fad-977…/src/app/implants/page.tsx

108 lines
4.9 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import TextAbout from '@/components/sections/about/TextAbout';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { CheckCircle, Star, Calendar } from "lucide-react";
import Link from "next/link";
export default function ImplantsPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "General Dentistry", id: "/general-dentistry" },
{ name: "Implants", id: "/implants" },
{ name: "Root Canals", id: "/root-canals" },
{ name: "Cosmetic", id: "/cosmetic-treatments" },
{ name: "Family Care", id: "/family-care" }
];
const footerNavItemsColumn1 = [
{ label: "General Dentistry", href: "/general-dentistry" },
{ label: "Dental Implants", href: "/implants" },
{ label: "Root Canals", href: "/root-canals" }
];
const footerNavItemsColumn2 = [
{ label: "Cosmetic Treatments", href: "/cosmetic-treatments" },
{ label: "Family Care", href: "/family-care" },
{ label: "About Us", href: "/#about" }
];
const footerNavItemsColumn3 = [
{ label: "Contact Us", href: "/contact" },
{ label: "Book Appointment", href: "/contact" },
{ label: "Privacy Policy", href: "#" }
];
return (
<ThemeProvider
defaultButtonVariant={"shift-hover"}
defaultTextAnimation={"entrance-slide"}
borderRadius={"pill"}
contentWidth={"smallMedium"}
sizing={"largeSmallSizeLargeTitles"}
background={"fluid"}
cardStyle={"layered-gradient"}
primaryButtonStyle={"diagonal-gradient"}
secondaryButtonStyle={"layered"}
headingFontWeight={"medium"}
>
<div id="nav" data-section="nav">
<NavbarStyleApple brandName="Family Dental Center" navItems={navItems.map(item => ({...item, href: item.id}))} />
</div>
<div id="about-implants" data-section="about-implants">
<TextAbout
title="Restore Your Smile with Dental Implants"
useInvertedBackground={false}
/>
</div>
<div id="metrics-implants" data-section="metrics-implants">
<MetricCardThree
title="Implant Success at a Glance"
description="Our high success rates and patient satisfaction speak volumes about the quality and care you'll receive for your dental implant procedure."
metrics={[
{ id: "im1", icon: CheckCircle, title: "Success Rate", value: "99%" },
{ id: "im2", icon: Star, title: "Patient Satisfaction", value: "5/5" },
{ id: "im3", icon: Calendar, title: "Lasting Results", value: "Decades" }
]}
animationType="none"
textboxLayout="default"
useInvertedBackground={true}
/>
</div>
<div id="features-implants" data-section="features-implants">
<FeatureCardThree
title="Why Choose Dental Implants?"
description="Discover the long-term benefits of dental implants, including durability, comfort, and improved oral health."
features={[
{ title: "Natural Look & Feel", description: "Implants are designed to blend seamlessly with your natural teeth.", imageSrc: "http://img.b2bpic.net/free-photo/conceptual-3d-illustration-dental-implant-inside-jawbone_183364-123704.jpg?_wi=2", imageAlt: "Natural-looking dental implant" },
{ title: "Durability & Longevity", description: "With proper care, dental implants can last a lifetime.", imageSrc: "http://img.b2bpic.net/free-photo/dentist-using-ultrasonic-scaler-treating-boy-s-teeth-clinic_23-2147905966.jpg?_wi=2", imageAlt: "Durable dental implant" },
{ title: "Preserves Bone Health", description: "Implants stimulate the jawbone, preventing bone loss that occurs with missing teeth.", imageSrc: "http://img.b2bpic.net/free-photo/indoor-shot-charming-little-girl-brushing-teeth-bathroom-while-standing-front-mirror-squeezing-toothpaste-out-tube-smiling-happily_176532-15698.jpg?_wi=2", imageAlt: "Bone health preservation" }
]}
gridVariant="three-columns-all-equal-width"
animationType="none"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="Family Dental Center"
columns={[
{ items: footerNavItemsColumn1.map(item => ({...item, Component: Link})) },
{ items: footerNavItemsColumn2.map(item => ({...item, Component: Link})) },
{ items: footerNavItemsColumn3.map(item => ({...item, Component: Link})) }
]}
/>
</div>
</ThemeProvider>
);
}