MetatroncubeSoftwareSolutions/rapharehap
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: MetatroncubeSoftwareSolutions:2ac6b353d0a579ddfa87a7c8a4fffb2a84bee9fd
Branches Tags
MetatroncubeSoftwareSolutions:main
MetatroncubeSoftwareSolutions:team
MetatroncubeSoftwareSolutions:test
..
compare: MetatroncubeSoftwareSolutions:fd5f320ebd91aacd4d4435ab42b3901e130259ac
Branches Tags
MetatroncubeSoftwareSolutions:main
MetatroncubeSoftwareSolutions:team
MetatroncubeSoftwareSolutions:test

No commits in common. "2ac6b353d0a579ddfa87a7c8a4fffb2a84bee9fd" and "fd5f320ebd91aacd4d4435ab42b3901e130259ac" have entirely different histories.
2ac6b353d0 ... fd5f320ebd

4 changed files with 266 additions and 311 deletions
Show Stats Expand all files Collapse all files

254
components/sections/home2/Banner.js
View File

@ -1,5 +1,5 @@
'use client' 'use client'
import React, { useState } from 'react'; import React, { useState, useEffect } from 'react';
import Link from "next/link"; import Link from "next/link";
import { Autoplay, Navigation, Pagination } from "swiper/modules"; import { Autoplay, Navigation, Pagination } from "swiper/modules";
import { Swiper, SwiperSlide } from "swiper/react"; import { Swiper, SwiperSlide } from "swiper/react";
@ -61,10 +61,71 @@ export default function Banner() {
const [activeIndex, setActiveIndex] = useState(0); const [activeIndex, setActiveIndex] = useState(0);
const [isAnimating, setIsAnimating] = useState(false); const [isAnimating, setIsAnimating] = useState(false);
const slides = [
{
id: 0,
variant: 'topToBottom',
bgImage: '/assets/images/banner/desktopBanner/home-banner-1.webp',
upperText: 'Begin Your Health Journey',
title: 'Better',
titleSpan: 'health',
titleEnd: 'Forever',
// subtitle: 'Expert Physiotherapy in Mississauga for You.',
description: 'Our expert physiotherapists help you restore movement, reduce pain, and live healthier with personalized care in Mississauga.',
buttonText: 'Book Your Appointment',
buttonLink: 'tel:+647-722-3434',
// contentStyle: 'mobile-style'
},
{
id: 1,
variant: 'bottomToTop',
bgImage: '/assets/images/banner/desktopBanner/home-banner-2.webp',
upperText: 'Care That Heals Gently',
title: 'Relaxing',
titleSpan: 'Massage',
titleEnd: 'Therapy',
// subtitle: 'Expert Hand Massage Techniques for Relief',
description: 'Experience soothing massage techniques that release tension, promote circulation, and support your overall wellness.',
buttonText: 'Schedule a Massage',
buttonLink: '/contact',
// contentStyle: 'with-background'
},
{
id: 2,
variant: 'leftToRight',
bgImage: '/assets/images/banner/desktopBanner/home-banner-3.webp',
upperText: 'Wellness Near You Always',
title: 'Trusted',
titleSpan: 'Physio',
titleEnd: 'Experts',
// subtitle: 'Physiotherapy Etobicoke & Rehab Care.',
description: 'Comprehensive physiotherapy and rehab services designed to restore your strength, mobility, and long-term wellness.',
buttonText: 'Explore Our Service',
buttonLink: '/etobicoke-treatment-service',
// contentStyle: 'with-background'
},
{
id: 3,
variant: 'rightToLeft',
bgImage: '/assets/images/banner/desktopBanner/home-banner-4.webp',
upperText: 'Healing With Caring Hands',
title: 'Holistic',
titleSpan: 'Wellness',
titleEnd: 'Care',
// subtitle: 'Waterfront Physio and Rehab Services.',
description: 'Discover holistic physiotherapy and rehab services designed to restore balance, ease pain, and support long-term recovery.',
buttonText: 'Visit Our Location',
buttonLink: '/contact',
// contentStyle: 'with-background'
}
];
const handleSlideChange = (swiper) => { const handleSlideChange = (swiper) => {
setIsAnimating(true); setIsAnimating(true);
setActiveIndex(swiper.realIndex || 0); setActiveIndex(swiper.realIndex || 0);
setTimeout(() => setIsAnimating(false), 1200); setTimeout(() => {
setIsAnimating(false);
}, 1200);
}; };
return ( return (
@ -72,142 +133,69 @@ export default function Banner() {
<Swiper <Swiper
{...swiperOptions} {...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}
> >
{/* Slide 1 */} {slides.map((slide, index) => (
<SwiperSlide> <SwiperSlide key={slide.id}>
<AnimatePresence mode="wait"> <AnimatePresence mode="wait">
{activeIndex === 0 && ( {activeIndex === index && (
<motion.div <motion.div
key="slide-0" key={`slide-${index}`}
className="slide-item banner-slide" className="slide-item banner-slide"
variants={variants.topToBottom} variants={variants[slide.variant]}
initial="initial" initial="initial"
animate="animate" animate="animate"
exit="exit" exit="exit"
transition={transition} transition={transition}
> >
<div className="bg-layer bg-slide-0" <div
style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/home-banner-1.webp)' }}> className={`bg-layer ${slide.id === 0 ? "bg-slide-0" : ""}`}
</div> style={{
<div className="auto-container" style={{height:"600px"}}> backgroundImage: `url(${slide.bgImage})`,
{/* <div className="content-box custom-content-box"> }}
<span className="upper-text">Begin Your Health Journey</span> ></div>
<h2>Better <span>health</span> Forever</h2> <div className="auto-container">
<p>Our expert physiotherapists help you restore movement, reduce pain, and live healthier with personalized care in Mississauga.</p> <div
<div className="btn-box mt-3"> className={`content-box custom-content-box ${slide.contentStyle || ''}`}
<Link href="tel:+647-722-3434" className="theme-btn btn-one"> style={slide.contentStyle === 'with-background' ? {
<span>Book Your Appointment</span> backgroundColor: '#fff',
</Link> opacity: 0.8,
</div> borderRadius: '20px',
</div> */} padding: '30px'
</div> } : {}}
</motion.div> >
)} <span className="upper-text">
</AnimatePresence> {slide.upperText}
</SwiperSlide> </span>
{/* Slide 2 */} <h2>
<SwiperSlide> {slide.title} <span>{slide.titleSpan}</span> {slide.titleEnd}
<AnimatePresence mode="wait"> </h2>
{activeIndex === 1 && (
<motion.div <p>
key="slide-1" {slide.subtitle}
className="slide-item banner-slide" </p>
variants={variants.bottomToTop}
initial="initial" <p>
animate="animate" {slide.description}
exit="exit" </p>
transition={transition}
> <div className="btn-box mt-3">
<div className="bg-layer" <Link href={slide.buttonLink} className="theme-btn btn-one">
style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/home-banner-2.webp)' }}> <span>{slide.buttonText}</span>
</div> </Link>
<div className="auto-container" style={{height:"600px", display:"flex", alignItems:"end"}}> </div>
<div className="content-box custom-content-box" style={{ backgroundColor: '#ffffff8a', opacity: 0.8, borderRadius: '20px', padding: '30px' }}>
<span className="upper-text">Care That Heals Gently</span>
<h2>Relaxing <span>Massage</span> Therapy</h2>
<p>Experience soothing massage techniques that release tension, promote circulation, and support your overall wellness.</p>
<div className="btn-box mt-3">
<Link href="/contact" className="theme-btn btn-one">
<span>Schedule a Massage</span>
</Link>
</div> </div>
</div> </div>
</div> </motion.div>
</motion.div> )}
)} </AnimatePresence>
</AnimatePresence> </SwiperSlide>
</SwiperSlide> ))}
{/* Slide 3 */}
<SwiperSlide>
<AnimatePresence mode="wait">
{activeIndex === 2 && (
<motion.div
key="slide-2"
className="slide-item banner-slide"
variants={variants.leftToRight}
initial="initial"
animate="animate"
exit="exit"
transition={transition}
>
<div className="bg-layer"
style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/home-banner-3.webp)' }}>
</div>
<div className="auto-container" style={{height:"600px", display:"flex", alignItems:"end"}}>
<div className="content-box custom-content-box" style={{ backgroundColor: '#ffffff8a', opacity: 0.8, borderRadius: '20px', padding: '30px' }}>
<span className="upper-text">Wellness Near You Always</span>
<h2>Trusted <span>Physio</span> Experts</h2>
<p>Comprehensive physiotherapy and rehab services designed to restore your strength, mobility, and long-term wellness.</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>
{/* Slide 4 */}
<SwiperSlide>
<AnimatePresence mode="wait">
{activeIndex === 3 && (
<motion.div
key="slide-3"
className="slide-item banner-slide"
variants={variants.rightToLeft}
initial="initial"
animate="animate"
exit="exit"
transition={transition}
>
<div className="bg-layer"
style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/home-banner-4.webp)' }}>
</div>
<div className="auto-container" style={{height:"600px", display:"flex", alignItems:"end"}}>
<div className="content-box custom-content-box" style={{ backgroundColor: '#ffffff8a', opacity: 0.8, borderRadius: '20px', padding: '30px' }}>
<span className="upper-text">Healing With Caring Hands</span>
<h2>Holistic <span>Wellness</span> Care</h2>
<p>Discover holistic physiotherapy and rehab services designed to restore balance, ease pain, and support long-term recovery.</p>
<div className="btn-box mt-3">
<Link href="/contact" className="theme-btn btn-one">
<span>Visit Our Location</span>
</Link>
</div>
</div>
</div>
</motion.div>
)}
</AnimatePresence>
</SwiperSlide>
</Swiper> </Swiper>
</section> </section>
); );
} };

171
public/assets/css/style.css
View File

@ -1015,32 +1015,32 @@
} }
/* Fully transparent header */ /* Fully transparent header */
.header-style-two, .header-style-two,
.header-style-two .header-top, .header-style-two .header-top,
.header-style-two .header-area { .header-style-two .header-area {
background: transparent !important; background: transparent !important;
box-shadow: none !important; box-shadow: none !important;
border: none !important; border: none !important;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
z-index: 999; z-index: 999;
} }
.header-style-two .header-top a, .header-style-two .header-top a,
.header-style-two .header-top .logo { .header-style-two .header-top .logo {
color: #bc0000 !important; color: #bc0000 !important;
} }
.header-style-two .header-top .top-inner { .header-style-two .header-top .top-inner {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding-left: 100px; padding-left: 100px;
padding-right: 100px; padding-right: 100px;
position: relative; position: relative;
} }
.header-top .top-inner { .header-top .top-inner {
@ -1264,7 +1264,7 @@
width: 100%; width: 100%;
} */ } */
.main-header .header-lower .outer-container { .main-header .header-lower .outer-container {
position: absolute; position: absolute;
left: 0px; left: 0px;
top: 0px; top: 0px;
@ -1274,12 +1274,11 @@
.main-header .header-lower .outer-box { .main-header .header-lower .outer-box {
position: relative; position: relative;
/* background: #fff; */ /* background: #fff; */
border-top: 1px solid #1025487a;
} }
.new { .new{
background-color: #fff !important; background-color: #fff !important;
} }
@ -1476,9 +1475,9 @@
transition: all 500ms ease; transition: all 500ms ease;
} }
.new-menu .new-nav>li>a { .new-menu .new-nav>li>a{
color: #bc0000 !important; color: #bc0000 !important;
} }
@ -2755,7 +2754,6 @@
position: relative; position: relative;
padding-left: 100px; padding-left: 100px;
padding-right: 100px; padding-right: 100px;
/* background: #bc000036 !important; */
} }
@media only screen and (max-width: 1200px) { @media only screen and (max-width: 1200px) {
@ -3357,20 +3355,20 @@
background: none; background: none;
} */ } */
@media (min-width: 768px) and (max-width: 1024px) { /* @media (min-width: 768px) and (max-width: 1024px) {
.custom-content-box.mobile-style { .custom-content-box.mobile-style {
top: 190px; top: 190px;
background: white; background: white;
border-radius: 15%; border-radius: 15%;
opacity: 0.8; opacity: 0.8;
} }
} } */
@media (min-width: 768px) and (max-width: 991px) { @media (min-width: 768px) and (max-width: 991px) {
.custom-content-box.with-background { .custom-content-box.with-background {
top: 170px; top: 170px;
} }
} }
/* @media (max-width: 425px) { /* @media (max-width: 425px) {
.custom-content-box.mobile-style { .custom-content-box.mobile-style {
@ -3469,15 +3467,14 @@
@media (max-width: 1024px) and (min-width: 769px) { @media (max-width: 1024px) and (min-width: 769px) {
.header-style-two .header-top .top-inner { .header-style-two .header-top .top-inner {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding-left: 0px !important; padding-left: 0px !important;
padding-right: 0px !important; padding-right: 0px !important;
position: relative; position: relative; /* Needed for flex children alignment */
/* Needed for flex children alignment */ }
}
.info-block-one { .info-block-one {
@ -3487,17 +3484,15 @@
@media (max-width: 768px) { @media (max-width: 768px) {
.header-style-two .header-top .top-inner { .header-style-two .header-top .top-inner {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding-left: 100px; padding-left: 100px;
padding-right: 100px; padding-right: 100px;
position: relative; position: relative; /* Needed for flex children alignment */
/* Needed for flex children alignment */ }
}
.blog-details-content .news-block-one .inner-box .lower-content h2 { .blog-details-content .news-block-one .inner-box .lower-content h2 {
font-size: 38px !important; font-size: 38px !important;
line-height: 36px; line-height: 36px;
@ -3551,33 +3546,29 @@
} }
.loader-wrap { .loader-wrap {
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: #ffffff; background: #ffffff;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
z-index: 9999; z-index: 9999;
} }
.preloader { .preloader {
text-align: center; text-align: center;
} }
.preloader-icon { .preloader-icon {
font-size: 50px; font-size: 50px;
animation: spin 1.5s linear infinite; animation: spin 1.5s linear infinite;
} }
@keyframes spin { @keyframes spin {
0% { 0% { transform: rotate(0deg); }
transform: rotate(0deg); 100% { transform: rotate(360deg); }
} }
100% {
transform: rotate(360deg);
}
}

2
public/sitemap.xml
View File

File diff suppressed because one or more lines are too long

144
scripts/generate-sitemap.cjs
View File

@ -4,109 +4,85 @@ const { SitemapStream, streamToPromise } = require("sitemap");
const { pathToFileURL } = require("url"); const { pathToFileURL } = require("url");
const hostname = "https://rapharehap.metatronnest.com"; const hostname = "https://rapharehap.metatronnest.com";
const addTrailingSlash = true; // ✅ Set this true if your Next.js uses trailingSlash: true const appDir = path.join(process.cwd(), "app");
const outputPath = path.join(process.cwd(), "public", "sitemap.xml");
// // 🔧 Utility to format URLs based on config function getRoutesFromApp(dir = appDir, basePath = "") {
// const formatUrl = (url) => { let routes = [];
// if (addTrailingSlash && !url.endsWith('/')) return url + '/'; if (!fs.existsSync(dir)) return routes;
// if (!addTrailingSlash && url.endsWith('/') && url !== '/') return url.slice(0, -1);
// return url;
// };
// Add a trailing slash only for “directory-like” URLs
const shouldAddSlash = (url) => {
// keep "/" as is
if (url === '/') return false;
// don't touch file-like URLs (has extension)
if (/\.[a-z0-9]{2,6}(\?.*)?$/i.test(url)) return false;
return true;
};
const formatUrl = (url) => { const entries = fs.readdirSync(dir, { withFileTypes: true });
// normalize to leading slash for (const entry of entries) {
if (!url.startsWith('/')) url = '/' + url; if (entry.name.startsWith("_") || entry.name === "api" || entry.name.startsWith(".")) continue;
const fullPath = path.join(dir, entry.name);
if (addTrailingSlash && shouldAddSlash(url) && !url.endsWith('/')) { if (entry.isDirectory()) {
return url + '/'; if (!entry.name.startsWith("[")) {
const hasPage =
fs.existsSync(path.join(fullPath, "page.js")) ||
fs.existsSync(path.join(fullPath, "page.jsx")) ||
fs.existsSync(path.join(fullPath, "index.js")) ||
fs.existsSync(path.join(fullPath, "index.jsx"));
if (hasPage) {
const cleaned = path.join(basePath, entry.name).replace(/\\/g, "/");
routes.push(`/${cleaned}/`);
}
}
routes = routes.concat(getRoutesFromApp(fullPath, path.join(basePath, entry.name)));
} else if (entry.isFile()) {
if (["page.js", "page.jsx", "index.js", "index.jsx"].includes(entry.name)) {
const cleaned = basePath.replace(/\\/g, "/");
const route = "/" + (cleaned ? `${cleaned}/` : "");
routes.push(route);
}
}
} }
if (!addTrailingSlash && url.endsWith('/') && url !== '/') {
return url.slice(0, -1);
}
return url;
};
// ✅ Static pages return [...new Set(routes.map(r => r.replace(/\/{2,}/g, "/")))];
const staticLinks = [ }
{ url: '/', changefreq: 'daily', priority: 1.0 },
{ url: '/caregivers/', changefreq: 'weekly', priority: 0.7 },
{ url: '/about-us/', changefreq: 'weekly', priority: 0.7 },
{ url: '/careers/', changefreq: 'weekly', priority: 0.7 },
{ url: '/portfolio/', changefreq: 'weekly', priority: 0.7 },
{ url: '/blog/', changefreq: 'weekly', priority: 0.7 },
{ url: '/contact/', changefreq: 'monthly', priority: 0.5 },
{ url: '/faq/', changefreq: 'monthly', priority: 0.5 },
{ url: '/service/website-development-company/', changefreq: 'weekly', priority: 0.6 },
{ url: '/service/mobile-application-development/', changefreq: 'weekly', priority: 0.6 },
{ url: '/service/graphic-designing-company/', changefreq: 'weekly', priority: 0.6 },
{ url: '/service/ui-ux-designing/', changefreq: 'weekly', priority: 0.6 },
{ url: '/service/search-engine-optimization-seo-content-writing/', changefreq: 'weekly', priority: 0.6 },
{ url: '/service/digital-marketing-agency-in-canada/', changefreq: 'weekly', priority: 0.6 },
{ url: '/service/app-development-waterloo/', changefreq: 'weekly', priority: 0.6 },
{ url: '/service/kitchener-waterloo-website-design-services/', changefreq: 'weekly', priority: 0.6 },
{ url: '/service/professional-website-designers-in-waterloo/', changefreq: 'weekly', priority: 0.6 },
{ url: '/service/waterloo-seo-services/', changefreq: 'weekly', priority: 0.6 },
{ url: '/service/web-design-toronto-custom-website-creation-by-metatroncube-software-solutions/', changefreq: 'weekly', priority: 0.6 },
{ url: '/service/web-page-design-in-waterloo/', changefreq: 'weekly', priority: 0.6 },
];
// ✅ Dynamic blog posts async function loadESModule(relativePath) {
const blogPosts = [ const fullPath = path.join(process.cwd(), relativePath);
{ slug: '5-tips-to-create-viral-content-that-drives-engagement/' }, if (!fs.existsSync(fullPath)) return null;
{ slug: 'instagram-vs-facebook-choosing-the-right-platform-for-your-business/' }, const mod = await import(pathToFileURL(fullPath).href);
{ slug: 'how-local-seo-can-drive-more-foot-traffic-to-your-business/' }, return mod.default ?? mod.Blogs ?? [];
{ slug: 'on-page-vs-off-page-seo-what-every-business-owner-needs-to-know/' }, }
{ slug: 'how-to-create-a-winning-digital-marketing-strategy-for-your-business/' },
{ slug: 'white-hat-vs-black-hat-seo-an-in-depth-link-building-guide/' },
{ slug: 'how-to-boost-your-small-business-with-effective-digital-marketing-strategies/' },
{ slug: 'the-importance-of-local-seo-for-real-estate-agents/' },
{ slug: 'how-to-optimize-your-website-for-voice-search/' },
{ slug: 'how-ai-is-revolutionizing-web-development-and-seo/' },
{ slug: 'top-digital-marketing-agency-in-canada-metatroncube-software-solutions/' },
{ slug: 'best-digital-marketing-company-in-canada-metatroncube-solutions/' },
{ slug: 'web-designers-for-small-business/' },
{ slug: 'mobile-commerce-2024-web-app-development-evolution/' },
];
// Convert blog slugs to sitemap entries
const blogLinks = blogPosts.map(post => ({
url: `/${post.slug}`,
changefreq: 'weekly',
priority: 0.6
}));
const allLinks = [...staticLinks, ...blogLinks].map(link => ({
...link,
url: formatUrl(link.url),
}));
async function generateSitemap() { async function generateSitemap() {
try { try {
const sitemap = new SitemapStream({ hostname: hostname });
const writeStream = fs.createWriteStream(path.resolve(__dirname, '../out/sitemap.xml'));
const staticRoutes = getRoutesFromApp();
const staticLinks = staticRoutes.map(route => ({
url: route,
changefreq: "weekly",
priority: route === "/" ? 1.0 : 0.8,
}));
const Blogs = await loadESModule("utils/Blog.utils.js");
const blogLinks = (Blogs || []).map(post => ({
url: `/blog/${post.slug}/`,
changefreq: "weekly",
priority: 0.8,
}));
const allLinks = [...staticLinks, ...blogLinks];
const sitemap = new SitemapStream({ hostname });
const writeStream = fs.createWriteStream(outputPath);
sitemap.pipe(writeStream); sitemap.pipe(writeStream);
console.log('📦 Writing URLs to sitemap:');
allLinks.forEach(link => { allLinks.forEach(link => {
console.log(' -', hostname + link.url);
sitemap.write(link); sitemap.write(link);
console.log("✅ writing:", link.url);
}); });
sitemap.end(); sitemap.end();
await streamToPromise(sitemap); await streamToPromise(sitemap);
console.log('✅ sitemap.xml created successfully!'); console.log(`🎉 sitemap.xml generated at ${outputPath} (${allLinks.length} URLs)`);
} catch (error) { } catch (err) {
console.error('❌ Error creating sitemap.xml:', error); console.error("❌ Failed to generate sitemap:", err);
process.exit(1);
} }
} }