Merge version_3 into main #5

Merged
bender merged 4 commits from version_3 into main 2026-05-26 05:17:05 +00:00
4 changed files with 342 additions and 144 deletions

View File

@@ -2,12 +2,49 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
import { Activity, Heart, ShieldCheck, Sparkles, User } from "lucide-react";
const NAV_ITEMS = [
{ name: "Home", id: "/" },
{ name: "About", id: "/about" }, { name: "Services", id: "/services" },
{ name: "Team", id: "/team" },
{ name: "Testimonials", id: "/testimonials" },
{ name: "Contact", id: "/contact" },
{ name: "Admin", id: "/admin" }
];
const FOOTER_COLUMNS = [
{
title: "About Us", items: [
{ label: "Home", href: "/" },
{ label: "About Sarah's Clinic", href: "/about" },
{ label: "Our Team", href: "/team" },
{ label: "Admin Panel", href: "/admin" },
],
},
{
title: "Services", items: [
{ label: "Pregnancy Care", href: "/services" },
{ label: "Fertility Treatments", href: "/services" },
{ label: "Gynecological Services", href: "/services" },
],
},
{
title: "Contact", items: [
{ label: "Book Appointment", href: "/contact" },
{ label: "Our Location", href: "/contact" },
{ label: "Call Us", href: "tel:+923214335773" },
],
},
{
title: "Connect", items: [
{ label: "Instagram", href: "https://www.instagram.com/dr_sarah_masood/" },
{ label: "Facebook", href: "https://www.facebook.com/drsarahmasoodconsultantgynaecologist" },
],
},
];
export default function AboutPage() {
return (
@@ -24,145 +61,48 @@ export default function AboutPage() {
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home", id: "/"},
{
name: "About", id: "/about"},
{
name: "Services", id: "/services"},
{
name: "Team", id: "/team"},
{
name: "Testimonials", id: "/testimonials"},
{
name: "Contact", id: "/contact"},
]}
brandName="Sarah's Clinic"
button={{
text: "Book Appointment", href: "/contact"}}
animateOnLoad={true}
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={NAV_ITEMS}
brandName="Sarah's Clinic"
button={{
text: "Book Appointment", href: "/contact"
}}
animateOnLoad={true}
/>
</div>
<div id="about-main" data-section="about-main">
<MetricSplitMediaAbout
useInvertedBackground={true}
title="About Sarah's Clinic"
description="At Sarah's Clinic, Dr. Sarah Masood (MBBS, FCPS, MRCOG UK, MDU) provides state-of-the-art gynecological and obstetric facilities in a professional and elegant environment. With master certifications in ART (IVF/ICSI), Reproductive Medicine, Laparoscopy, Hysteroscopy, and Diabetes, we are dedicated to ensuring healthy outcomes for both mother and baby. We believe in personalized care that respects your journey. Our clinic is located at DHA Phase 1 K block market 301/1, Ghazi Rd, opposite police station, Sector K Dha Phase 1, Lahore, 54792. Clinic timings: 1pm to 3pm (morning) and 6pm to 9pm (evening), Monday to Saturday."
metrics={[
{
value: "10+", title: "Years of Experience"},
{
value: "1000+", title: "Successful Deliveries"},
{
value: "98%", title: "Patient Satisfaction"},
]}
tag="Our Story"
imageSrc="http://img.b2bpic.net/free-photo/building_1127-2955.jpg?_wi=2"
imageAlt="Exterior of Sarah's Clinic"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="about-content" data-section="about-content">
<MetricSplitMediaAbout
useInvertedBackground={true}
title="Compassionate Care, Exceptional Results"
description="At Sarah's Clinic, Dr. Sarah Masood (MBBS, FCPS, MRCOG UK, MDU) provides state-of-the-art gynecological and obstetric facilities in a professional and elegant environment. With master certifications in ART (IVF/ICSI), Reproductive Medicine, Laparoscopy, Hysteroscopy, and Diabetes, we are dedicated to ensuring healthy outcomes for both mother and baby. We believe in personalized care that respects your journey."
metrics={[
{
value: "10+", title: "Years of Experience"
},
{
value: "1000+", title: "Successful Deliveries"
},
{
value: "98%", title: "Patient Satisfaction"
},
]}
tag="About Us"
imageSrc="http://img.b2bpic.net/free-photo/building_1127-2955.jpg?_wi=1"
imageAlt="Exterior of Sarah's Clinic"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="team-brief" data-section="team-brief">
<TeamCardEleven
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
groups={[
{
id: "doctors", groupTitle: "Our Leading Experts", members: [
{
id: "dr-sarah-masood", title: "Dr. Sarah Masood", subtitle: "Obstetrician & Gynecologist, Founder", detail: "MBBS, FCPS, MRCOG UK, MDU. Master certification in ART (IVF/ICSI) & Reproductive Medicine. Master certification in laparoscopy & hysteroscopy. Masters in diabetes.", imageSrc: "http://img.b2bpic.net/free-photo/happy-young-female-doctor-wearing-medical-robe-looking-touching-chin-belly-isolated_141793-68719.jpg?_wi=2", imageAlt: "Dr. Sarah Masood"},
{
id: "dr-osama-haroon", title: "Dr. Osama Haroon", subtitle: "Highly Qualified Pediatrician", detail: "For appointments, contact 03009461269. Location: Sarahs Clinic, K block, DHA phase 1, Lahore. Timings: 3pm to 5pm.", imageSrc: "http://img.b2bpic.net/free-photo/cute-boy-with-folder-standing-against-white-backdrop_23-2147906025.jpg?_wi=2", imageAlt: "Dr. Osama Haroon"},
]
},
]}
title="Our Dedicated Team"
description="Our highly qualified and compassionate team is committed to providing the best possible care for you and your family."
tag="The Experts"
/>
</div>
<div id="contact-footer" data-section="contact-footer">
<ContactSplitForm
useInvertedBackground={true}
title="Get in Touch"
description="Schedule your appointment with Dr. Sarah Masood. We look forward to welcoming you to Sarah's Clinic. You can also find us at DHA Phase 1 K block market 301/1, Ghazi Rd, opposite police station, Sector K Dha Phase 1, Lahore."
inputs={[
{
name: "name", type: "text", placeholder: "Your Name", required: true,
},
{
name: "email", type: "email", placeholder: "Your Email", required: true,
},
{
name: "phone", type: "tel", placeholder: "Your Phone Number (e.g., 0321 4335773)", required: false,
},
]}
textarea={{
name: "message", placeholder: "Your Message / Appointment Request", rows: 5,
required: true,
}}
imageSrc="http://img.b2bpic.net/free-photo/home-entrance-with-furniture-modern-decor_23-2150832014.jpg?_wi=2"
imageAlt="Interior of Sarah's Clinic waiting area"
mediaAnimation="slide-up"
mediaPosition="right"
buttonText="Send Message"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="Sarah's Clinic"
columns={[
{
title: "About Us", items: [
{
label: "Home", href: "/"},
{
label: "About Sarah's Clinic", href: "/about"},
{
label: "Our Team", href: "/team"},
],
},
{
title: "Services", items: [
{
label: "Pregnancy Care", href: "/services"},
{
label: "Fertility Treatments", href: "/services"},
{
label: "Gynecological Services", href: "/services"},
],
},
{
title: "Contact", items: [
{
label: "Book Appointment", href: "/contact"},
{
label: "Our Location", href: "/contact"},
{
label: "Call Us", href: "tel:+923214335773"},
],
},
{
title: "Connect", items: [
{
label: "Instagram", href: "https://www.instagram.com/dr_sarah_masood/"},
{
label: "Facebook", href: "https://www.facebook.com/drsarahmasoodconsultantgynaecologist"},
],
},
]}
copyrightText="© 2024 Sarah's Clinic. All rights reserved."
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="Sarah's Clinic"
columns={FOOTER_COLUMNS}
copyrightText="© 2024 Sarah's Clinic. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);

113
src/app/admin/page.tsx Normal file
View File

@@ -0,0 +1,113 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
export default function AdminPage() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="mediumSmall"
sizing="largeSmallSizeMediumTitles"
background="noise"
cardStyle="gradient-radial"
primaryButtonStyle="gradient"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/#about" },
{ name: "Services", id: "/#services" },
{ name: "Team", id: "/#team" },
{ name: "Testimonials", id: "/#testimonials" },
{ name: "Contact", id: "/#contact" },
{ name: "Admin", id: "/admin" },
]}
brandName="Sarah's Clinic - Admin"
button={{ text: "Logout", href: "/" }}
animateOnLoad={true}
/>
</div>
<div id="admin-panel" data-section="admin-panel" className="py-20 flex flex-col items-center justify-center text-center">
<h1 className="text-4xl font-bold mb-4">Admin Panel: Image Gallery Management</h1>
<p className="text-lg max-w-2xl text-foreground/80 mb-12">
Manage your social media images here. This system allows you to fetch images from linked social accounts, upload new ones, organize your gallery, and ensure they are displayed beautifully across the front pages of the website.
</p>
<div id="image-gallery-management" data-section="image-gallery-management" className="w-full max-w-screen-xl px-4">
<BlogCardOne
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
title="Managed Social Images"
description="Review and organize the images currently in your social media gallery. Click on any image for more options (e.g., edit, delete, view analytics)."
tag="Gallery"
buttons={[
{ text: "Upload New Image", onClick: () => alert('Simulating image upload...'), href: "#" },
{ text: "Fetch from Social Media", onClick: () => alert('Simulating fetching from social media...'), href: "#" }
]}
blogs={[
{
id: "admin-img-1", category: "Social Post", title: "Clinic Tour Snapshot", excerpt: "Behind-the-scenes look at our welcoming clinic environment.", imageSrc: "http://img.b2bpic.net/free-photo/medical-clinic-reception-waiting-room-interior-with-furniture-no-people_482257-51624.jpg", imageAlt: "Clinic interior view", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/stethoscope-glasses-notepad-pen_23-2147926715.jpg", date: "2024-07-20"
},
{
id: "admin-img-2", category: "Patient Story", title: "Happy Family Moment", excerpt: "A heartwarming picture shared by one of our happy families.", imageSrc: "http://img.b2bpic.net/free-photo/top-view-parents-cute-baby_23-2149453506.jpg", imageAlt: "Happy parents with baby", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/stethoscope-glasses-notepad-pen_23-2147926715.jpg", date: "2024-07-18"
},
{
id: "admin-img-3", category: "Wellness Tip", title: "Healthy Lifestyle Focus", excerpt: "Promoting wellness and active living with our latest health tips.", imageSrc: "http://img.b2bpic.net/free-photo/woman-doing-yoga-fitness-gym_23-2148030283.jpg", imageAlt: "Woman doing yoga", authorName: "Admin", authorAvatar: "http://img.b2bpic.net/free-photo/stethoscope-glasses-notepad-pen_23-2147926715.jpg", date: "2024-07-15"
}
]}
/>
</div>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="Sarah's Clinic"
columns={[
{
title: "About Us", items: [
{ label: "Home", href: "/" },
{ label: "About Sarah's Clinic", href: "/#about" },
{ label: "Our Team", href: "/#team" },
{ label: "Admin Panel", href: "/admin" },
],
},
{
title: "Services", items: [
{ label: "Pregnancy Care", href: "/#services" },
{ label: "Fertility Treatments", href: "/#services" },
{ label: "Gynecological Services", href: "/#services" },
],
},
{
title: "Contact", items: [
{ label: "Book Appointment", href: "/#contact" },
{ label: "Our Location", href: "/#contact" },
{ label: "Call Us", href: "tel:+923214335773" },
],
},
{
title: "Connect", items: [
{ label: "Instagram", href: "https://www.instagram.com/dr_sarah_masood/" },
{ label: "Facebook", href: "https://www.facebook.com/drsarahmasoodconsultantgynaecologist" },
],
},
]}
copyrightText="© 2024 Sarah's Clinic. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

View File

@@ -0,0 +1,145 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
export default function AppointmentPage() {
// Placeholder for form submission logic
const handleAppointmentSubmit = (data: Record<string, string>) => {
console.log("Appointment request submitted:", data);
alert("Your appointment request has been sent! We will contact you shortly to confirm.");
// In a real application, this would send data to a backend API
// for email/WhatsApp notifications and admin panel management.
};
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="mediumSmall"
sizing="largeSmallSizeMediumTitles"
background="noise"
cardStyle="gradient-radial"
primaryButtonStyle="gradient"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home", id: "/"},
{
name: "About", id: "/#about"},
{
name: "Services", id: "/#services"},
{
name: "Team", id: "/#team"},
{
name: "Testimonials", id: "/#testimonials"},
{
name: "Book Appointment", id: "/book-appointment"},
{
name: "Contact", id: "/#contact"},
{
name: "Admin", id: "/admin"},
]}
brandName="Sarah's Clinic"
button={{
text: "Book Appointment", href: "/book-appointment"}}
animateOnLoad={true}
/>
</div>
<div id="appointment-form" data-section="appointment-form">
<ContactSplitForm
useInvertedBackground={true}
title="Book Your Appointment"
description="Please fill out the form below to request an appointment with Dr. Sarah Masood. Our team will contact you to confirm the date and time."
inputs={[
{
name: "name", type: "text", placeholder: "Your Full Name", required: true,
},
{
name: "email", type: "email", placeholder: "Your Email", required: true,
},
{
name: "phone", type: "tel", placeholder: "Your Phone Number", required: true,
},
{
name: "date", type: "date", placeholder: "Preferred Date", required: true,
},
{
name: "time", type: "time", placeholder: "Preferred Time", required: true,
},
]}
textarea={{
name: "message", placeholder: "Any specific concerns or details?", rows: 5,
required: false,
}}
imageSrc="http://img.b2bpic.net/free-photo/elderly-doctor-making-notes-clipboard_23-2147896784.jpg"
imageAlt="Doctor taking notes for appointment"
mediaAnimation="slide-up"
mediaPosition="right"
buttonText="Request Appointment"
onSubmit={handleAppointmentSubmit}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="Sarah's Clinic"
columns={[
{
title: "About Us", items: [
{
label: "Home", href: "/"},
{
label: "About Sarah's Clinic", href: "/#about"},
{
label: "Our Team", href: "/#team"},
{
label: "Admin Panel", href: "/admin"},
],
},
{
title: "Services", items: [
{
label: "Pregnancy Care", href: "/#services"},
{
label: "Fertility Treatments", href: "/#services"},
{
label: "Gynecological Services", href: "/#services"},
],
},
{
title: "Contact", items: [
{
label: "Book Appointment", href: "/book-appointment"},
{
label: "Our Location", href: "/#contact"},
{
label: "Call Us", href: "tel:+923214335773"},
],
},
{
title: "Connect", items: [
{
label: "Instagram", href: "https://www.instagram.com/dr_sarah_masood/"},
{
label: "Facebook", href: "https://www.facebook.com/drsarahmasoodconsultantgynaecologist"},
],
},
]}
copyrightText="© 2024 Sarah's Clinic. All rights reserved."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

View File

@@ -106,7 +106,7 @@ export default function LandingPage() {
<div id="services" data-section="services">
<FeatureCardTwentyFive
animationType="slide-up"
animationType="depth-3d"
textboxLayout="default"
useInvertedBackground={false}
features={[
@@ -173,7 +173,7 @@ export default function LandingPage() {
<div id="team" data-section="team">
<TeamCardEleven
animationType="slide-up"
animationType="depth-3d"
textboxLayout="default"
useInvertedBackground={true}
groups={[
@@ -344,4 +344,4 @@ export default function LandingPage() {
</ReactLenis>
</ThemeProvider>
);
}
}