Update src/app/page.tsx

Update src/app/layout.tsx
Switch to version 5: modified src/app/page.tsx
2026-03-07 17:10:39 +00:00 · 2026-03-07 17:10:38 +00:00 · 2026-03-07 17:05:50 +00:00 · 2026-03-07 17:05:49 +00:00 · 2026-03-07 17:05:36 +00:00 · 2026-03-07 17:05:35 +00:00
2 changed files with 53 additions and 126 deletions
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,57 +1,21 @@
 import type { Metadata } from "next";
-import { Source_Sans_3 } from "next/font/google";
-import { Halant } from "next/font/google";
 import { Inter } from "next/font/google";
-import "./globals.css";
-import { ServiceWrapper } from "@/components/ServiceWrapper";
-import Tag from "@/tag/Tag";
+import "./styles/variables.css";
+import "./styles/base.css";

-const sourceSans3 = Source_Sans_3({
-  variable: "--font-source-sans-3",  subsets: ["latin"],
-});
-
-const halant = Halant({
-  variable: "--font-halant",  subsets: ["latin"],
-  weight: ["300", "400", "500", "600", "700"],
-});
-
-const inter = Inter({
-  variable: "--font-inter",  subsets: ["latin"],
-});
+const inter = Inter({ subsets: ["latin"] });

 export const metadata: Metadata = {
-  title: "Expert Dental Care | Premium Dental Services & Treatment",  description: "Experience expert dental care with advanced technology and skilled dentists. Comprehensive cosmetic, restorative, and preventive dental services for your perfect smile.",  keywords: "expert dental care, cosmetic dentistry, dental implants, professional dentist, premium dental services",  metadataBase: new URL("https://expertdentalcare.com"),
-  alternates: {
-    canonical: "https://expertdentalcare.com"
-  },
-  openGraph: {
-    title: "Expert Dental Care | Premium Dental Services & Treatment",    description: "Experience expert dental care with advanced technology and skilled dentists. Comprehensive cosmetic, restorative, and preventive dental services for your perfect smile.",    siteName: "Expert Dental Care",    type: "website",    images: [
-      {
-        url: "http://img.b2bpic.net/free-photo/dentist-process-dental-services-dental-office-dental-treatment_1321-2973.jpg",        alt: "Expert dental care"
-      }
-    ]
-  },
-  twitter: {
-    card: "summary_large_image",    title: "Expert Dental Care | Premium Dental Services & Treatment",    description: "Experience expert dental care with advanced technology and skilled dentists.",    images: [
-      "http://img.b2bpic.net/free-photo/dentist-process-dental-services-dental-office-dental-treatment_1321-2973.jpg"
-    ]
-  }
-};
+  title: "Expert Dental Care",  description: "Premium dental care excellence with luxury amenities and cutting-edge technology"};

 export default function RootLayout({
  children,
-}: Readonly<{
+}: {
  children: React.ReactNode;
-}>) {
+}) {
  return (
-    <html lang="en" suppressHydrationWarning>
-      <ServiceWrapper>
-        <body
-          className={`${sourceSans3.variable} ${halant.variable} ${inter.variable} antialiased`}
-        >
-          <Tag />
-          {children}
-        
+    <html lang="en">
+      <body className={inter.className}>{children}
        <script
          dangerouslySetInnerHTML={{
            __html: `
@@ -1419,7 +1383,6 @@ export default function RootLayout({
          }}
        />
      </body>
-      </ServiceWrapper>
    </html>
  );
 }
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -5,11 +5,11 @@ import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloating
 import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
 import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
 import InlineImageSplitTextAbout from "@/components/sections/about/InlineImageSplitTextAbout";
-import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
+import FeatureCardNine from "@/components/sections/feature/FeatureCardNine";
 import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
 import ContactSplit from "@/components/sections/contact/ContactSplit";
 import FooterBase from "@/components/sections/footer/FooterBase";
-import { Star, Sparkles, Award, Heart, Mail, CheckCircle } from "lucide-react";
+import { Star, Sparkles, Award, Heart, Mail, Calendar, X, Clock, Users, CheckCircle } from "lucide-react";
 import { useState } from "react";
 import React from "react";

@@ -50,54 +50,6 @@ const TIME_SLOTS: TimeSlot[] = [
  { time: '04:00 PM', available: true },
 ];

-// Pre-generate random values outside of render to avoid impure function violations
-const generateRandomValues = () => {
-  return Array.from({ length: 30 }).map(() => ({
-    delay: Math.random() * 2,
-    duration: 3 + Math.random() * 2,
-    x: Math.random() * 100,
-    y: Math.random() * 100,
-    size: 2 + Math.random() * 4,
-    offsetX: Math.random() * 100 - 50,
-    offsetY: Math.random() * 100 - 50,
-  }));
-};
-
-const RANDOM_VALUES = generateRandomValues();
-
-function FloatingDotsAnimation() {
-  return (
-    <div className="fixed inset-0 pointer-events-none overflow-hidden">
-      {RANDOM_VALUES.map((values, i) => (
-        <div
-          key={i}
-          className="absolute rounded-full bg-magenta-500 opacity-60"
-          style={{
-            width: `${values.size}px`,
-            height: `${values.size}px`,
-            left: `${values.x}%`,
-            top: `${values.y}%`,
-            animation: `float-dots ${values.duration}s ease-in-out ${values.delay}s infinite`,
-            backgroundColor: '#ff00ff',
-          }}
-        />
-      ))}
-      <style>{`
-        @keyframes float-dots {
-          0%, 100% {
-            transform: translate(0, 0) scale(1);
-            opacity: 0.3;
-          }
-          50% {
-            transform: translate(var(--tx), var(--ty)) scale(1.2);
-            opacity: 0.8;
-          }
-        }
-      `}</style>
-    </div>
-  );
-}
-
 function BookingModal({ isOpen, onClose, onSubmit }: { isOpen: boolean; onClose: () => void; onSubmit: (data: any) => void }) {
  const [state, setState] = React.useState<BookingState>({
    isOpen,
@@ -158,6 +110,12 @@ function BookingModal({ isOpen, onClose, onSubmit }: { isOpen: boolean; onClose:
    onClose();
  };

+  const getNextAvailableDate = () => {
+    const tomorrow = new Date();
+    tomorrow.setDate(tomorrow.getDate() + 1);
+    return tomorrow.toISOString().split('T')[0];
+  };
+
  const getDateRangeOptions = () => {
    const dates = [];
    for (let i = 1; i <= 30; i++) {
@@ -184,7 +142,7 @@ function BookingModal({ isOpen, onClose, onSubmit }: { isOpen: boolean; onClose:
            onClick={onClose}
            className="p-2 hover:bg-blue-200 rounded-lg transition"
          >
-            <svg className="w-6 h-6 text-gray-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" /></svg>
+            <X size={24} className="text-gray-600" />
          </button>
        </div>

@@ -242,7 +200,7 @@ function BookingModal({ isOpen, onClose, onSubmit }: { isOpen: boolean; onClose:
                  >
                    <div className="font-semibold text-gray-900">{service.name}</div>
                    <div className="text-sm text-gray-500 flex items-center gap-1 mt-1">
-                      <svg className="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" /></svg> {service.duration}
+                      <Clock size={14} /> {service.duration}
                    </div>
                  </button>
                ))}
@@ -416,7 +374,6 @@ export default function LandingPage() {
      secondaryButtonStyle="solid"
      headingFontWeight="light"
    >
-      <FloatingDotsAnimation />
      <BookingModal
        isOpen={bookingOpen}
        onClose={() => setBookingOpen(false)}
@@ -429,6 +386,7 @@ export default function LandingPage() {
          navItems={[
            { name: "Services", id: "services" },
            { name: "About", id: "about" },
+            { name: "Features", id: "features" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" },
          ]}
@@ -455,7 +413,7 @@ export default function LandingPage() {
          enableKpiAnimation={true}
          buttons={[
            { text: "Book Consultation", onClick: () => setBookingOpen(true) },
-            { text: "Learn More", href: "#services" },
+            { text: "Learn More", href: "#features" },
          ]}
          buttonAnimation="slide-up"
          imageSrc="http://img.b2bpic.net/free-photo/dentist-process-dental-services-dental-office-dental-treatment_1321-2973.jpg"
@@ -465,6 +423,39 @@ export default function LandingPage() {
        />
      </div>

+      <div id="features" data-section="features">
+        <FeatureCardNine
+          title="Why Choose Us"
+          description="We combine luxury amenities with cutting-edge dental technology to create an unparalleled patient experience."
+          tag="Our Advantages"
+          tagIcon={Award}
+          tagAnimation="slide-up"
+          textboxLayout="default"
+          useInvertedBackground={false}
+          features={[
+            {
+              id: 1,
+              title: "Patient Comfort",              description: "Relax in our luxurious treatment rooms with premium seating, ambient lighting, and calming environments designed for maximum comfort.",              phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-patient_23-2148396133.jpg?_wi=1", imageAlt: "Comfortable patient treatment area" },
+              phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-patient_23-2148396133.jpg?_wi=2", imageAlt: "Comfortable patient treatment area" }
+            },
+            {
+              id: 2,
+              title: "Advanced Technology",              description: "We invest in the latest dental technology including digital imaging, laser treatments, and computer-guided implant placement.",              phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/dentist-doctor-patient-looking-digital-teeh-x-ray-dental-office-person-pov-stomatology-wearing-protective-face-mask-gloves-pointing-teeth-radiography-stomatological-clinic_482257-13097.jpg?_wi=1", imageAlt: "Advanced dental technology" },
+              phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/dentist-doctor-patient-looking-digital-teeh-x-ray-dental-office-person-pov-stomatology-wearing-protective-face-mask-gloves-pointing-teeth-radiography-stomatological-clinic_482257-13097.jpg?_wi=2", imageAlt: "Advanced dental technology" }
+            },
+            {
+              id: 3,
+              title: "Expert Team",              description: "Our board-certified dentists and specialists have over 25 years combined experience delivering exceptional results.",              phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/smiley-doctor-talking-with-nurse_23-2148757329.jpg?_wi=1", imageAlt: "Professional dental team" },
+              phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/smiley-doctor-talking-with-nurse_23-2148757329.jpg?_wi=2", imageAlt: "Professional dental team" }
+            },
+          ]}
+          showStepNumbers={true}
+          animationType="slide-up"
+          buttons={[{ text: "Schedule Appointment", onClick: () => setBookingOpen(true) }]}
+          buttonAnimation="slide-up"
+        />
+      </div>
+
      <div id="services" data-section="services">
        <ProductCardTwo
          title="Premium Dental Services"
@@ -513,33 +504,6 @@ export default function LandingPage() {
        />
      </div>

-      <div id="features" data-section="features">
-        <FeatureCardOne
-          title="Why Choose Us"
-          description="We combine luxury amenities with cutting-edge dental technology to create an unparalleled patient experience."
-          tag="Our Advantages"
-          tagIcon={Award}
-          tagAnimation="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          features={[
-            {
-              title: "Patient Comfort",              description: "Relax in our luxurious treatment rooms with premium seating, ambient lighting, and calming environments designed for maximum comfort.",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-patient_23-2148396133.jpg",              imageAlt: "Comfortable patient treatment area"
-            },
-            {
-              title: "Advanced Technology",              description: "We invest in the latest dental technology including digital imaging, laser treatments, and computer-guided implant placement.",              imageSrc: "http://img.b2bpic.net/free-photo/dentist-doctor-patient-looking-digital-teeh-x-ray-dental-office-person-pov-stomatology-wearing-protective-face-mask-gloves-pointing-teeth-radiography-stomatological-clinic_482257-13097.jpg",              imageAlt: "Advanced dental technology"
-            },
-            {
-              title: "Expert Team",              description: "Our board-certified dentists and specialists have over 25 years combined experience delivering exceptional results.",              imageSrc: "http://img.b2bpic.net/free-photo/smiley-doctor-talking-with-nurse_23-2148757329.jpg",              imageAlt: "Professional dental team"
-            },
-          ]}
-          gridVariant="three-columns-all-equal-width"
-          animationType="slide-up"
-          buttons={[{ text: "Schedule Appointment", onClick: () => setBookingOpen(true) }]}
-          buttonAnimation="slide-up"
-        />
-      </div>
-
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="Patient Success Stories"
Author	SHA1	Message	Date
bender	cce61c48a3	Update src/app/page.tsx	2026-03-07 17:10:39 +00:00
bender	b72aeb9031	Update src/app/layout.tsx	2026-03-07 17:10:38 +00:00
bender	2b7a1c49ee	Switch to version 5: modified src/app/page.tsx	2026-03-07 17:05:50 +00:00
bender	1e39cfd4be	Switch to version 5: modified src/app/layout.tsx	2026-03-07 17:05:49 +00:00
bender	b16995238f	Switch to version 4: modified src/app/page.tsx	2026-03-07 17:05:36 +00:00
bender	c9c62de5f5	Switch to version 4: modified src/app/layout.tsx	2026-03-07 17:05:35 +00:00
bender	a31b409bbc	Switch to version 5: modified src/app/page.tsx	2026-03-07 17:05:06 +00:00
bender	ca844cddde	Switch to version 5: modified src/app/layout.tsx	2026-03-07 17:05:05 +00:00
bender	34a680df35	Switch to version 6: modified src/app/page.tsx	2026-03-07 17:02:57 +00:00
bender	7276d20164	Switch to version 6: modified src/app/layout.tsx	2026-03-07 17:02:56 +00:00
bender	ba939da9ff	Switch to version 5: modified src/app/page.tsx	2026-03-07 17:02:32 +00:00
bender	19e0e8b1fa	Switch to version 5: modified src/app/layout.tsx	2026-03-07 17:02:31 +00:00
bender	594476ac3b	Switch to version 4: modified src/app/page.tsx	2026-03-07 17:02:16 +00:00
bender	fa1f36dffe	Switch to version 4: modified src/app/layout.tsx	2026-03-07 17:02:16 +00:00
bender	c2996b5452	Switch to version 5: modified src/app/page.tsx	2026-03-07 17:01:57 +00:00
bender	8b1e85e222	Switch to version 5: modified src/app/layout.tsx	2026-03-07 17:01:57 +00:00
bender	1f48fa0d0c	Merge version_6 into main Merge version_6 into main	2026-03-07 17:00:20 +00:00
bender	04c289ee17	Update src/app/page.tsx	2026-03-07 17:00:16 +00:00
bender	82f3fd2fad	Merge version_6 into main Merge version_6 into main	2026-03-07 16:59:25 +00:00
bender	55bfa8e535	Update src/app/page.tsx	2026-03-07 16:59:21 +00:00
bender	785f6f369e	Merge version_6 into main Merge version_6 into main	2026-03-07 16:57:59 +00:00
bender	66a2fbe3ec	Update src/app/page.tsx	2026-03-07 16:57:55 +00:00
bender	6b7c08e416	Update src/app/layout.tsx	2026-03-07 16:57:55 +00:00
bender	9b07ffbbce	Merge version_5 into main Merge version_5 into main	2026-03-07 16:52:09 +00:00
bender	075b45d404	Update src/app/page.tsx	2026-03-07 16:52:05 +00:00
bender	65eb8e1c6a	Merge version_5 into main Merge version_5 into main	2026-03-07 16:51:19 +00:00
bender	14b5625c0a	Update src/app/page.tsx	2026-03-07 16:51:15 +00:00
bender	fcb8394ad1	Merge version_5 into main Merge version_5 into main	2026-03-07 16:49:40 +00:00
bender	e135ff8fe7	Update src/app/page.tsx	2026-03-07 16:49:36 +00:00
bender	4f78c3faf1	Update src/app/layout.tsx	2026-03-07 16:49:36 +00:00
bender	7a071d376b	Switch to version 3: modified src/app/page.tsx	2026-03-07 16:44:25 +00:00
bender	134bd05ad7	Merge version_4 into main Merge version_4 into main	2026-03-07 16:41:24 +00:00
bender	7192fb24f2	Merge version_4 into main Merge version_4 into main	2026-03-07 16:39:33 +00:00