Merge version_1 into main #2
301
src/app/page.tsx
301
src/app/page.tsx
@@ -9,7 +9,7 @@ import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
import { Sparkles } from "lucide-react";
|
||||
import { Sparkles, Activity, Award, User } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -26,220 +26,103 @@ export default function LandingPage() {
|
||||
headingFontWeight="light"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="GHASAQ CLINIC"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="GHASAQ CLINIC"
|
||||
button={{ text: "Book Now", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
title="Enhancing Natural Beauty with Precision"
|
||||
description="Ghasaq Clinic combines cutting-edge AI technology with expert medical care to deliver personalized aesthetics and wellness solutions."
|
||||
tag="Advanced Aesthetics & Wellness"
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/defocused-woman-gym-using-equipment-with-medical-mask-hand-sanitizer-bottle_23-2148762623.jpg",
|
||||
imageAlt: "Luxurious Clinic Interior",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-looking-screen_23-2149126944.jpg?_wi=1",
|
||||
imageAlt: "Advanced AI Diagnostics",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/caucasian-woman-going-through-microblading-treatment_23-2149102677.jpg?_wi=1",
|
||||
imageAlt: "Laser Technology",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-people-relaxing-together_23-2151178228.jpg?_wi=1",
|
||||
imageAlt: "Luxury Facility",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-female_23-2148880262.jpg?_wi=1",
|
||||
imageAlt: "Elegant Aesthetic Results",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
ratingText="Trusted by 1000+ Patients"
|
||||
tagIcon={Sparkles}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="Enhancing Natural Beauty with Precision"
|
||||
description="Ghasaq Clinic combines cutting-edge AI technology with expert medical care to deliver personalized aesthetics and wellness solutions."
|
||||
tag="Advanced Aesthetics & Wellness"
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/defocused-woman-gym-using-equipment-with-medical-mask-hand-sanitizer-bottle_23-2148762623.jpg", imageAlt: "Luxurious Clinic Interior" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-looking-screen_23-2149126944.jpg", imageAlt: "Advanced AI Diagnostics" }
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
ratingText="Trusted by 1000+ Patients"
|
||||
tagIcon={Sparkles}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Our Clinical Excellence"
|
||||
metrics={[
|
||||
{
|
||||
label: "Years Experience",
|
||||
value: "12+",
|
||||
},
|
||||
{
|
||||
label: "Successful Treatments",
|
||||
value: "5000+",
|
||||
},
|
||||
{
|
||||
label: "Expert Specialists",
|
||||
value: "4",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Our Clinical Excellence"
|
||||
metrics={[
|
||||
{ icon: Award, label: "Years Experience", value: "12+" },
|
||||
{ icon: Activity, label: "Successful Treatments", value: "5000+" },
|
||||
{ icon: User, label: "Expert Specialists", value: "4" },
|
||||
]}
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardMedia
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "dermatology",
|
||||
title: "Dermatology",
|
||||
description: "Focused on diagnosing and treating all skin conditions using medical-grade solutions.",
|
||||
tag: "Medical",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-looking-screen_23-2149126944.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "aesthetics",
|
||||
title: "Aesthetic Medicine",
|
||||
description: "Non-surgical cosmetic procedures for facial harmony and youthfulness.",
|
||||
tag: "Beauty",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/caucasian-woman-going-through-microblading-treatment_23-2149102677.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "laser",
|
||||
title: "Laser Technology",
|
||||
description: "FDA-approved laser technologies for safe, effective skin resurfacing.",
|
||||
tag: "High-Tech",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-people-relaxing-together_23-2151178228.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="Our Specialized Departments"
|
||||
description="Comprehensive care across dermatology, aesthetics, and wellness."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardMedia
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "dermatology", title: "Dermatology", description: "Focused on diagnosing and treating all skin conditions using medical-grade solutions.", tag: "Medical", imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-looking-screen_23-2149126944.jpg"},
|
||||
{
|
||||
id: "aesthetics", title: "Aesthetic Medicine", description: "Non-surgical cosmetic procedures for facial harmony and youthfulness.", tag: "Beauty", imageSrc: "http://img.b2bpic.net/free-photo/caucasian-woman-going-through-microblading-treatment_23-2149102677.jpg"},
|
||||
{
|
||||
id: "laser", title: "Laser Technology", description: "FDA-approved laser technologies for safe, effective skin resurfacing.", tag: "High-Tech", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-people-relaxing-together_23-2151178228.jpg"},
|
||||
]}
|
||||
title="Our Specialized Departments"
|
||||
description="Comprehensive care across dermatology, aesthetics, and wellness."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Ahmed",
|
||||
date: "Oct 2023",
|
||||
title: "Exceptional care",
|
||||
quote: "The AI diagnostic approach really changed how I view my skin health.",
|
||||
tag: "Skin Care",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-male-doctor-special-equipment_23-2148980809.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/old-woman-uses-phone-photo-hotel_482257-103236.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Omar Khalil",
|
||||
date: "Sep 2023",
|
||||
title: "Professional and clean",
|
||||
quote: "Top-tier clinic with knowledgeable doctors. My skin has never looked better.",
|
||||
tag: "Laser",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/high-angle-male-nurse-with-stethoscope_23-2148501144.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-african-american-woman-cafe_273609-5064.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Laila Mahmoud",
|
||||
date: "Aug 2023",
|
||||
title: "Highly recommended",
|
||||
quote: "Personalized treatment plans that actually deliver real, natural results.",
|
||||
tag: "Aesthetics",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/professional-doctor-ready-work_23-2147642818.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-female-patient-physiotherapy_23-2148780719.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Hassan Youssef",
|
||||
date: "Jul 2023",
|
||||
title: "Great technology",
|
||||
quote: "The recovery programs were exactly what I needed post-procedure.",
|
||||
tag: "Wellness",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-male-doctor-special-equipment_23-2148980809.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/make-up-artist-making-client-laugh_23-2148398584.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Nora Ali",
|
||||
date: "Jun 2023",
|
||||
title: "Life changing",
|
||||
quote: "I am so happy with my results. The staff is warm and attentive.",
|
||||
tag: "Beauty",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/professional-doctor-ready-work_23-2147642818.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-female_23-2148880262.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="Patient Success Stories"
|
||||
description="Hear what our patients say about their experience at Ghasaq."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Ahmed", date: "Oct 2023", title: "Exceptional care", quote: "The AI diagnostic approach really changed how I view my skin health.", tag: "Skin Care", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-male-doctor-special-equipment_23-2148980809.jpg", imageSrc: "http://img.b2bpic.net/free-photo/old-woman-uses-phone-photo-hotel_482257-103236.jpg" },
|
||||
{ id: "2", name: "Omar Khalil", date: "Sep 2023", title: "Professional and clean", quote: "Top-tier clinic with knowledgeable doctors. My skin has never looked better.", tag: "Laser", avatarSrc: "http://img.b2bpic.net/free-photo/high-angle-male-nurse-with-stethoscope_23-2148501144.jpg", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-african-american-woman-cafe_273609-5064.jpg" },
|
||||
{ id: "3", name: "Laila Mahmoud", date: "Aug 2023", title: "Highly recommended", quote: "Personalized treatment plans that actually deliver real, natural results.", tag: "Aesthetics", avatarSrc: "http://img.b2bpic.net/free-photo/professional-doctor-ready-work_23-2147642818.jpg", imageSrc: "http://img.b2bpic.net/free-photo/front-view-female-patient-physiotherapy_23-2148780719.jpg" },
|
||||
{ id: "4", name: "Hassan Youssef", date: "Jul 2023", title: "Great technology", quote: "The recovery programs were exactly what I needed post-procedure.", tag: "Wellness", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-male-doctor-special-equipment_23-2148980809.jpg", imageSrc: "http://img.b2bpic.net/free-photo/make-up-artist-making-client-laugh_23-2148398584.jpg" },
|
||||
{ id: "5", name: "Nora Ali", date: "Jun 2023", title: "Life changing", quote: "I am so happy with my results. The staff is warm and attentive.", tag: "Beauty", avatarSrc: "http://img.b2bpic.net/free-photo/professional-doctor-ready-work_23-2147642818.jpg", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-young-female_23-2148880262.jpg" }
|
||||
]}
|
||||
title="Patient Success Stories"
|
||||
description="Hear what our patients say about their experience at Ghasaq."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
text="Experience the future of aesthetics. Book your consultation today and step into a new world of wellness."
|
||||
buttons={[
|
||||
{
|
||||
text: "WhatsApp Booking",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
text: "Visit Our Clinic",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
text="Experience the future of aesthetics. Book your consultation today and step into a new world of wellness."
|
||||
buttons={[
|
||||
{ text: "WhatsApp Booking", href: "#" },
|
||||
{ text: "Visit Our Clinic", href: "#" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="GHASAQ CLINIC"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Terms & Conditions",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="GHASAQ CLINIC"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Terms & Conditions", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user