Update src/app/services/page.tsx

Merge version_3 into main

src/app/facilities/page.tsx

@@ -0,0 +1,64 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
+
+export default function FacilitiesPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="shift-hover"
+        defaultTextAnimation="background-highlight"
+        borderRadius="soft"
+        contentWidth="small"
+        sizing="largeSmall"
+        background="blurBottom"
+        cardStyle="gradient-radial"
+        primaryButtonStyle="flat"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="bold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Services", id: "/services" },
+              { name: "Facilities", id: "/facilities" },
+              { name: "Patient Portal", id: "/patient-portal" },
+            ]}
+            brandName="Dent Cent"
+          />
+        </div>
+
+        <main className="py-20">
+            <FeatureCardTwentyEight
+                title="Our Relaxing Environment"
+                description="Designed to make every visit comfortable and stress-free."
+                animationType="slide-up"
+                textboxLayout="default"
+                useInvertedBackground={false}
+                features={[
+                    {
+                        id: "facility-1",                        title: "Comfortable Waiting Zone",                        subtitle: "A serene space to relax before your appointment.",                        category: "Waiting",                        value: "Comfort",                        buttons: [{ text: "Tour Space" }]
+                    },
+                    {
+                        id: "facility-2",                        title: "Exclusive Clinic Cafe",                        subtitle: "Refreshing cold drinks while you wait.",                        category: "Cafe",                        value: "Refresh",                        buttons: [{ text: "View Menu" }]
+                    }
+                ]}
+            />
+        </main>
+
+        <div id="footer" data-section="footer">
+          <FooterLogoReveal
+            logoText="Dent Cent Clinic"
+            leftLink={{ text: "Privacy Policy", href: "#" }}
+            rightLink={{ text: "Kirkuk, Baghdad Rd", href: "#" }}
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -4,8 +4,11 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+import { useState } from 'react';
 
 export default function LandingPage() {
+  const [lang, setLang] = useState("EN");
+
   const handleBooking = () => {
     window.open("https://wa.me/9647703131418", "_blank");
   };
@@ -28,6 +31,7 @@ export default function LandingPage() {
           <NavbarStyleCentered
             navItems={[
               { name: "Home", id: "/" },
+              { name: "Face ID System", id: "/face-id-system" },
               { name: "Patient Portal", id: "/patient-portal" },
             ]}
             brandName="Dent Cent"
@@ -35,8 +39,13 @@ export default function LandingPage() {
         </div>
 
         <main className="py-20 text-center">
+          <div className="mb-6 flex justify-center gap-4">
+            <button onClick={() => setLang("EN")} className={`px-2 ${lang === 'EN' ? 'font-bold underline' : ''}`}>EN</button>
+            <button onClick={() => setLang("AR")} className={`px-2 ${lang === 'AR' ? 'font-bold underline' : ''}`}>AR</button>
+            <button onClick={() => setLang("TR")} className={`px-2 ${lang === 'TR' ? 'font-bold underline' : ''}`}>TR</button>
+          </div>
           <h1 className="text-4xl font-bold mb-6">Patient Portal</h1>
-          <p className="mb-10 text-lg opacity-80">Manage your dental health and appointments.</p>
+          <p className="mb-10 text-lg opacity-80">Manage your dental health, appointments, and Face ID access.</p>
           <div className="max-w-xl mx-auto p-8 border rounded-lg">
             <p>Authentication and dashboard modules are available for authorized patients.</p>
             <button className="mt-6 px-6 py-3 bg-primary rounded-lg" onClick={handleBooking}>
@@ -49,7 +58,7 @@ export default function LandingPage() {
           <FooterLogoReveal
             logoText="Dent Cent Clinic"
             leftLink={{ text: "Privacy Policy", href: "#" }}
-            rightLink={{ text: "Kirkuk, Baghdad Rd", href: "#" }}
+            rightLink={{ text: "Kirkuk, Baghdad Rd | Language: " + lang, onClick: () => setLang(lang === 'EN' ? 'AR' : 'EN') }}
           />
         </div>
       </ReactLenis>

src/app/patient-portal/page.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
 
@@ -18,39 +19,39 @@ export default function PatientPortal() {
         secondaryButtonStyle="radial-glow"
         headingFontWeight="bold"
     >
-      <div id="nav" data-section="nav">
+      <ReactLenis root>
-        <NavbarStyleCentered
+        <div id="nav" data-section="nav">
-          navItems={[
+          <NavbarStyleCentered
-            { name: "Home", id: "/" },
+            navItems={[
-            { name: "Patient Portal", id: "/patient-portal" },
+              { name: "Home", id: "/" },
-          ]}
+              { name: "Patient Portal", id: "/patient-portal" },
-          brandName="Dent Cent"
+            ]}
-        />
+            brandName="Dent Cent"
-      </div>
+          />
-
-      <main className="min-h-screen py-24 container mx-auto px-6">
-        <h1 className="text-4xl font-bold mb-12 text-center">Patient Dashboard</h1>
-        <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
-          <div className="p-8 border rounded-xl">
-            <h2 className="text-2xl font-semibold mb-4">Profile</h2>
-            <p className="opacity-70">View and update your personal information and health records.</p>
-          </div>
-          <div className="p-8 border rounded-xl">
-            <h2 className="text-2xl font-semibold mb-4">Appointments</h2>
-            <p className="opacity-70">Book new visits or view your upcoming and past appointments.</p>
-          </div>
-          <div className="p-8 border rounded-xl">
-            <h2 className="text-2xl font-semibold mb-4">History</h2>
-            <p className="opacity-70">Review your complete dental treatment history.</p>
-          </div>
         </div>
-      </main>
 
-      <FooterLogoReveal
+        <main className="py-20 max-w-4xl mx-auto px-6">
-        logoText="Dent Cent Clinic"
+          <h1 className="text-3xl font-bold mb-8">Patient Dashboard</h1>
-        leftLink={{ text: "Privacy Policy", href: "#" }}
+          <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
-        rightLink={{ text: "Kirkuk, Baghdad Rd", href: "#" }}
+            <div className="p-6 border rounded-lg shadow-sm">
-      />
+                <h2 className="text-xl font-semibold mb-4">My Appointments</h2>
+                <p className="text-sm opacity-70">View and manage your upcoming dental visits.</p>
+            </div>
+            <div className="p-6 border rounded-lg shadow-sm">
+                <h2 className="text-xl font-semibold mb-4">Medical Records</h2>
+                <p className="text-sm opacity-70">Secure access to your dental history and treatment plans.</p>
+            </div>
+          </div>
+        </main>
+
+        <div id="footer" data-section="footer">
+          <FooterLogoReveal
+            logoText="Dent Cent Clinic"
+            leftLink={{ text: "Privacy Policy", href: "#" }}
+            rightLink={{ text: "Kirkuk, Baghdad Rd", href: "#" }}
+          />
+        </div>
+      </ReactLenis>
     </ThemeProvider>
   );
 }

src/app/services/page.tsx

@@ -0,0 +1,64 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
+import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
+import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
+import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
+
+export default function ServicesPage() {
+  return (
+    <ThemeProvider
+        defaultButtonVariant="shift-hover"
+        defaultTextAnimation="background-highlight"
+        borderRadius="soft"
+        contentWidth="small"
+        sizing="largeSmall"
+        background="blurBottom"
+        cardStyle="gradient-radial"
+        primaryButtonStyle="flat"
+        secondaryButtonStyle="radial-glow"
+        headingFontWeight="bold"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleCentered
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Services", id: "/services" },
+              { name: "Facilities", id: "/facilities" },
+              { name: "Patient Portal", id: "/patient-portal" },
+            ]}
+            brandName="Dent Cent"
+          />
+        </div>
+
+        <main className="py-20">
+            <FeatureCardTwentyEight
+                title="Our Specialized Treatments"
+                description="Advanced dental care solutions tailored to your comfort and health."
+                animationType="slide-up"
+                textboxLayout="default"
+                useInvertedBackground={false}
+                features={[
+                    {
+                        id: "treatment-1",                        title: "Electrical Anesthesia",                        subtitle: "Electronic anesthesia delivery for a painless experience.",                        category: "Anesthesia",                        value: "Painless",                        buttons: [{ text: "Learn More" }]
+                    },
+                    {
+                        id: "treatment-2",                        title: "Advanced Dental Care",                        subtitle: "Comprehensive dental treatments including restorative.",                        category: "Dental",                        value: "Advanced",                        buttons: [{ text: "View Treatments" }]
+                    }
+                ]}
+            />
+        </main>
+
+        <div id="footer" data-section="footer">
+          <FooterLogoReveal
+            logoText="Dent Cent Clinic"
+            leftLink={{ text: "Privacy Policy", href: "#" }}
+            rightLink={{ text: "Kirkuk, Baghdad Rd", href: "#" }}
+          />
+        </div>
+      </ReactLenis>
+    </ThemeProvider>
+  );
+}