This commit is contained in:
akash 2025-09-30 21:55:41 +05:30
commit 68f16697da
5 changed files with 172 additions and 156 deletions

View File

@ -23,7 +23,7 @@ export const metadata = {
export default function RootLayout({ children }) { export default function RootLayout({ children }) {
return ( return (
<html lang="en" className={`${poppins.variable}`}> <html lang="en" className={`${poppins.variable}`}>
<Head> <Head>
{/* Lazy load non-critical CSS */} {/* Lazy load non-critical CSS */}
<link <link
rel="stylesheet" rel="stylesheet"
@ -43,6 +43,19 @@ export default function RootLayout({ children }) {
media="print" media="print"
onLoad="this.media='all'" onLoad="this.media='all'"
/> />
{/* Microsoft Clarity Tracking */}
<script
dangerouslySetInnerHTML={{
__html: `
(function(c,l,a,r,i,t,y){
c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/th7p0lr1ca";
y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
})(window, document, "clarity", "script", "th7p0lr1ca");
`,
}}
/>
</Head> </Head>
<body> <body>
{children} {children}

View File

@ -35,7 +35,9 @@ export default function AreaOfInjury() {
<div className="row clearfix"> <div className="row clearfix">
{areaOfInjuryData.slice(0, 8).map((area, index) => ( {areaOfInjuryData.slice(0, 8).map((area, index) => (
<div key={index} className="col-lg-3 col-md-6 col-6 team-block d-flex"> <div key={index} className="col-lg-3 col-md-6 col-6 team-block d-flex">
<div className="team-block-one wow fadeInUp animated d-flex flex-column flex-grow-1" data-wow-delay={`${index * 200}ms`} data-wow-duration="1500ms"> <div className="team-block-one wow fadeInUp animated d-flex flex-column flex-grow-1"
// data-wow-delay={`${index * 50}ms`} data-wow-duration="500ms"
>
<div className="inner-box d-flex flex-column flex-grow-1"> <div className="inner-box d-flex flex-column flex-grow-1">
<div className="image-box"> <div className="image-box">
<figure className="image"> <figure className="image">

View File

@ -49,48 +49,48 @@ const variants = {
}, },
rightToLeft: { rightToLeft: {
initial: { x: '100vw', opacity: 0 }, initial: { x: '100vw', opacity: 0 },
animate: { animate: {
x: 0, x: 0,
opacity: 1, opacity: 1,
transition: { transition: {
duration: 0.8, // adjust speed duration: 0.8, // adjust speed
ease: "easeInOut" // try "easeOut", "easeIn", or custom [0.4, 0, 0.2, 1] ease: "easeInOut" // try "easeOut", "easeIn", or custom [0.4, 0, 0.2, 1]
} }
}, },
exit: { exit: {
x: "-100vw", x: "-100vw",
opacity: 0, opacity: 0,
transition: { transition: {
duration: 0.6, duration: 0.6,
ease: "easeInOut" ease: "easeInOut"
} }
} }
}, },
}; };
const revealVariants = { const revealVariants = {
hidden: { hidden: {
scaleX: 0, scaleX: 0,
opacity: 0, opacity: 0,
originX: 0, // same as transform-origin: 0% 50% originX: 0, // same as transform-origin: 0% 50%
}, },
visible: { visible: {
scaleX: 1, scaleX: 1,
opacity: 1, opacity: 1,
originX: 0, originX: 0,
transition: { transition: {
duration: 0.8, duration: 0.6,
ease: "easeInOut" ease: "easeInOut"
}
},
exit: {
scaleX: 0,
opacity: 0,
originX: 0,
transition: {
duration: 0.6,
ease: "easeInOut"
}
} }
},
exit: {
scaleX: 0,
opacity: 0,
originX: 0,
transition: {
duration: 0.6,
ease: "easeInOut"
}
}
}; };
const transition = { const transition = {
@ -111,125 +111,126 @@ export default function Banner() {
return ( return (
<section className="banner-style-two p_relative"> <section className="banner-style-two p_relative">
<Swiper {...swiperOptions} <Swiper {...swiperOptions}
className="banner-carousel owl-theme owl-carousel owl-nav-none owl-dots-none" className="banner-carousel owl-theme owl-carousel owl-nav-none owl-dots-none"
onSwiper={(swiper) => setActiveIndex(swiper.realIndex || 0)} onSwiper={(swiper) => setActiveIndex(swiper.realIndex || 0)}
onSlideChange={handleSlideChange} onSlideChange={handleSlideChange}
> >
<SwiperSlide> <SwiperSlide>
<AnimatePresence mode="wait"> <AnimatePresence mode="wait">
{activeIndex === 0 && ( {activeIndex === 0 && (
<motion.div key="slide-3" <motion.div key="slide-3"
className="slide-item banner-slide" className="slide-item banner-slide"
variants={revealVariants} variants={revealVariants}
initial="initial" animate="animate" exit="exit" transition={transition}> initial="initial" animate="animate" exit="exit" transition={transition}>
<div className="bg-layer" <div className="bg-layer"
style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/banner-4.png)' }}> style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/banner-4.png)' }}>
</div> </div>
<div className="auto-container" style={{ height: "600px", display: "flex", alignItems: "end",justifyContent: "start", textAlign: "start" }}> <div className="auto-container" style={{ height: "600px", display: "flex", alignItems: "end", justifyContent: "start", textAlign: "start" }}>
<div className="content-box custom-content-box"> <div className="content-box custom-content-box">
<span className="upper-text mb-2">Begin your</span> <span className="upper-text mb-2">Begin your</span>
<h2 style={{ color: "#bc0000" }}>Recovery</h2> <h2 style={{ color: "#bc0000" }}>Recovery</h2>
<p className='text-white'> Rehab Strength Training Personalized Care </p> <p className='text-white'> Rehab Strength Training Personalized Care </p>
<div className="btn-box mt-3"> <div className="btn-box mt-3">
<Link href="/contact" className="theme-btn btn-one"> <Link href="/contact" className="theme-btn btn-one">
<span>Vist Our Location</span> <span>Vist Our Location</span>
</Link> </Link>
</div> </div>
</div> </div>
</div> </div>
</motion.div> </motion.div>
)} )}
</AnimatePresence> </AnimatePresence>
</SwiperSlide> </SwiperSlide>
<SwiperSlide> <SwiperSlide>
<AnimatePresence mode="wait"> <AnimatePresence mode="wait">
{activeIndex === 1 && ( {activeIndex === 1 && (
<motion.div key="slide-0" <motion.div key="slide-0"
className="slide-item banner-slide" className="slide-item banner-slide"
//variants={variants.rightToLeft} //variants={variants.rightToLeft}
variants={revealVariants} variants={revealVariants}
initial="initial" animate="animate" exit="exit" transition={transition}> initial="initial" animate="animate" exit="exit" transition={transition}>
<div className="bg-layer bg-slide-0" <div className="bg-layer bg-slide-0"
style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/banner-1.png)' }}> style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/banner-1.png)' }}>
</div> </div>
<div className="auto-container" style={{ height: "600px", display: "flex", alignItems: "end", justifyContent: "end", textAlign: "center" }}> <div className="auto-container" style={{ height: "600px", display: "flex", alignItems: "end", justifyContent: "end", textAlign: "center" }}>
<div className="content-box custom-content-box"> <div className="content-box custom-content-box">
<span className="upper-text mb-2 ">Build Your Strength & </span> <span className="upper-text mb-2 ">Build Your Strength & </span>
<h2 style={{ color: "#bc0000" }}>Endurance</h2> <h2 style={{ color: "#bc0000" }}>Endurance</h2>
<p className=' text-white'> Physiotherapy Sports Therapy Injury Prevention</p> <p className=' text-white'> Physiotherapy Sports Therapy Injury Prevention</p>
<div className="btn-box mt-3"> <div className="btn-box mt-3">
<Link href="tel:+647-722-3434" className="theme-btn btn-one"> <Link href="tel:+647-722-3434" className="theme-btn btn-one">
<span>Book Your Appointment</span> <span>Book Your Appointment</span>
</Link> </Link>
</div> </div>
</div> </div>
</div> </div>
</motion.div> </motion.div>
)} )}
</AnimatePresence> </AnimatePresence>
</SwiperSlide> </SwiperSlide>
{/* ✅ existing 3rd slide remains as 3rd */} {/* ✅ existing 3rd slide remains as 3rd */}
<SwiperSlide> <SwiperSlide>
<AnimatePresence mode="wait"> <AnimatePresence mode="wait">
{activeIndex === 2 && ( {activeIndex === 2 && (
<motion.div key="slide-2" <motion.div key="slide-2"
className="slide-item banner-slide" className="slide-item banner-slide"
//variants={variants.rightToLeft} //variants={variants.rightToLeft}
variants={revealVariants} variants={revealVariants}
initial="initial" animate="animate" exit="exit" transition={transition}> initial="initial" animate="animate" exit="exit" transition={transition}>
<div className="bg-layer" <div className="bg-layer"
style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/banner-3.webp)' }}> style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/banner-3.webp)' }}>
</div> </div>
<div className="auto-container" style={{ height: "600px", display: "flex", alignItems: "end", justifyContent: "start", textAlign: "start" }}> <div className="auto-container" style={{ height: "600px", display: "flex", alignItems: "end", justifyContent: "start", textAlign: "start" }}>
<div className="content-box custom-content-box"> <div className="content-box custom-content-box">
<span className="upper-text mb-2">Regain Your Strength</span> <span className="upper-text mb-2">Regain Your Strength</span>
<h2 style={{ color: "#bc0000" }}> Heal </h2> <h2 style={{ color: "#bc0000" }}> Heal </h2>
<p className=' text-white'> Pain Relief mobility Wellness </p> <p className=' text-white'> Pain Relief mobility Wellness </p>
<div className="btn-box mt-3"> <div className="btn-box mt-3">
<Link href="/etobicoke-treatment-service" className="theme-btn btn-one"> <Link href="/contact" className="theme-btn btn-one">
<span>Explore Our Service</span> <span>Schedule a Massage</span>
</Link> </Link>
</div>
</div>
</div>
</motion.div>
)}
</AnimatePresence>
</SwiperSlide>
<SwiperSlide> </div>
<AnimatePresence mode="wait"> </div>
{activeIndex === 3 && ( </div>
<motion.div key="slide-1" </motion.div>
className="slide-item banner-slide" )}
//variants={variants.rightToLeft} </AnimatePresence>
variants={revealVariants} </SwiperSlide>
initial="initial" animate="animate" exit="exit" transition={transition}>
<div className="bg-layer"
style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/banner-2.png)' }}>
</div>
<div className="auto-container" style={{ height: "600px", display: "flex", alignItems: "end", justifyContent: "center", textAlign: "center" }}>
<div className="content-box custom-content-box">
<span className="upper-text mb-3">Build your Core </span>
<h2 style={{ color: "#bc0000" }}>Performance</h2>
<p className=' text-white'> Pain Relief Active Care Long-Term Result</p>
<div className="btn-box mt-3">
<Link href="/contact" className="theme-btn btn-one">
<span>Schedule a Massage</span>
</Link>
</div>
</div>
</div>
</motion.div>
)}
</AnimatePresence>
</SwiperSlide>
</Swiper> <SwiperSlide>
<AnimatePresence mode="wait">
{activeIndex === 3 && (
<motion.div key="slide-1"
className="slide-item banner-slide"
//variants={variants.rightToLeft}
variants={revealVariants}
initial="initial" animate="animate" exit="exit" transition={transition}>
<div className="bg-layer"
style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/banner-2.png)' }}>
</div>
<div className="auto-container" style={{ height: "600px", display: "flex", alignItems: "end", justifyContent: "center", textAlign: "center" }}>
<div className="content-box custom-content-box">
<span className="upper-text mb-3">Build your Core </span>
<h2 style={{ color: "#bc0000" }}>Performance</h2>
<p className=' text-white'> Pain Relief Active Care Long-Term Result</p>
<div className="btn-box mt-3">
<Link href="/etobicoke-treatment-service" className="theme-btn btn-one">
<span>Explore Our Service</span>
</Link>
</div>
</div>
</div>
</motion.div>
)}
</AnimatePresence>
</SwiperSlide>
</Swiper>
</section> </section>
); );

File diff suppressed because one or more lines are too long

View File

@ -3,7 +3,7 @@ const path = require("path");
const { SitemapStream, streamToPromise } = require("sitemap"); const { SitemapStream, streamToPromise } = require("sitemap");
const { pathToFileURL } = require("url"); const { pathToFileURL } = require("url");
const hostname = "https://rapharehap.metatronnest.com"; const hostname = "https://rapharehab.ca";
const addTrailingSlash = true; // ✅ Set this true if your Next.js uses trailingSlash: true const addTrailingSlash = true; // ✅ Set this true if your Next.js uses trailingSlash: true
// // 🔧 Utility to format URLs based on config // // 🔧 Utility to format URLs based on config