banner section updated

components/sections/home2/Banner.js

@@ -1,5 +1,5 @@
 'use client'
-import React, { useState, useEffect } from 'react';
+import React, { useState } from 'react';
 import Link from "next/link";
 import { Autoplay, Navigation, Pagination } from "swiper/modules";
 import { Swiper, SwiperSlide } from "swiper/react";
@@ -61,71 +61,10 @@ export default function Banner() {
     const [activeIndex, setActiveIndex] = useState(0);
     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) => {
         setIsAnimating(true);
         setActiveIndex(swiper.realIndex || 0);
-        setTimeout(() => {
+        setTimeout(() => setIsAnimating(false), 1200);
-            setIsAnimating(false);
-        }, 1200);
     };
 
     return (
@@ -133,59 +72,66 @@ export default function Banner() {
             <Swiper
                 {...swiperOptions}
                 className="banner-carousel owl-theme owl-carousel owl-nav-none owl-dots-none"
-                onSwiper={(swiper) => {
+                onSwiper={(swiper) => setActiveIndex(swiper.realIndex || 0)}
-                    setActiveIndex(swiper.realIndex || 0);
-                }}
                 onSlideChange={handleSlideChange}
             >
-                {slides.map((slide, index) => (
+                {/* Slide 1 */}
-                    <SwiperSlide key={slide.id}>
+                <SwiperSlide>
                     <AnimatePresence mode="wait">
-                            {activeIndex === index && (
+                        {activeIndex === 0 && (
                             <motion.div
-                                    key={`slide-${index}`}
+                                key="slide-0"
                                 className="slide-item banner-slide"
-                                    variants={variants[slide.variant]}
+                                variants={variants.topToBottom}
                                 initial="initial"
                                 animate="animate"
                                 exit="exit"
                                 transition={transition}
                             >
-                                    <div
+                                <div className="bg-layer bg-slide-0"
-                                        className={`bg-layer ${slide.id === 0 ? "bg-slide-0" : ""}`}
+                                     style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/home-banner-1.webp)' }}>
-                                        style={{
+                                </div>
-                                            backgroundImage: `url(${slide.bgImage})`,
+                                <div className="auto-container" style={{height:"600px"}}>
-                                        }}
+                                    {/* <div className="content-box custom-content-box">
-                                    ></div>
+                                        <span className="upper-text">Begin Your Health Journey</span>
-                                    <div className="auto-container">
+                                        <h2>Better <span>health</span> Forever</h2>
-                                        <div
+                                        <p>Our expert physiotherapists help you restore movement, reduce pain, and live healthier with personalized care in Mississauga.</p>
-                                            className={`content-box custom-content-box ${slide.contentStyle || ''}`}
-                                            style={slide.contentStyle === 'with-background' ? {
-                                                backgroundColor: '#fff',
-                                                opacity: 0.8,
-                                                borderRadius: '20px',
-                                                padding: '30px'
-                                            } : {}}
-                                        >
-                                            <span className="upper-text">
-                                                {slide.upperText}
-                                            </span>
-
-                                            <h2>
-                                                {slide.title} <span>{slide.titleSpan}</span> {slide.titleEnd}
-                                            </h2>
-
-                                            <p>
-                                                {slide.subtitle}
-                                            </p>
-
-                                            <p>
-                                                {slide.description}
-                                            </p>
-
                                         <div className="btn-box mt-3">
-                                                <Link href={slide.buttonLink} className="theme-btn btn-one">
+                                            <Link href="tel:+647-722-3434" className="theme-btn btn-one">
-                                                    <span>{slide.buttonText}</span>
+                                                <span>Book Your Appointment</span>
+                                            </Link>
+                                        </div>
+                                    </div> */}
+                                </div>
+                            </motion.div>
+                        )}
+                    </AnimatePresence>
+                </SwiperSlide>
+
+                {/* Slide 2 */}
+                <SwiperSlide>
+                    <AnimatePresence mode="wait">
+                        {activeIndex === 1 && (
+                            <motion.div
+                                key="slide-1"
+                                className="slide-item banner-slide"
+                                variants={variants.bottomToTop}
+                                initial="initial"
+                                animate="animate"
+                                exit="exit"
+                                transition={transition}
+                            >
+                                <div className="bg-layer"
+                                     style={{ backgroundImage: 'url(/assets/images/banner/desktopBanner/home-banner-2.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">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>
@@ -194,8 +140,74 @@ export default function Banner() {
                         )}
                     </AnimatePresence>
                 </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>
         </section>
     );
-};
+}

public/assets/css/style.css

@@ -1274,6 +1274,7 @@
  .main-header .header-lower .outer-box {
    position: relative;
    /* background: #fff; */
+   border-top: 1px solid #1025487a;
  }
 
  .new {
@@ -2754,6 +2755,7 @@
    position: relative;
    padding-left: 100px;
    padding-right: 100px;
+   /* background: #bc000036 !important; */
  }
 
  @media only screen and (max-width: 1200px) {
@@ -3473,7 +3475,8 @@
      align-items: center;
      padding-left: 0px !important;
      padding-right: 0px !important;
-  position: relative; /* Needed for flex children alignment */
+     position: relative;
+     /* Needed for flex children alignment */
    }
 
 
@@ -3491,8 +3494,10 @@
      align-items: center;
      padding-left: 100px;
      padding-right: 100px;
-  position: relative; /* Needed for flex children alignment */
+     position: relative;
+     /* Needed for flex children alignment */
    }
+
    .blog-details-content .news-block-one .inner-box .lower-content h2 {
      font-size: 38px !important;
      line-height: 36px;
@@ -3568,7 +3573,11 @@
  }
 
  @keyframes spin {
-  0% { transform: rotate(0deg); }
+   0% {
-  100% { transform: rotate(360deg); }
+     transform: rotate(0deg);
    }
 
+   100% {
+     transform: rotate(360deg);
+   }
+ }

scripts/generate-sitemap.cjs

@@ -4,85 +4,109 @@ const { SitemapStream, streamToPromise } = require("sitemap");
 const { pathToFileURL } = require("url");
 
 const hostname = "https://rapharehap.metatronnest.com";
-const appDir = path.join(process.cwd(), "app");
+const addTrailingSlash = true; // ✅ Set this true if your Next.js uses trailingSlash: true
-const outputPath = path.join(process.cwd(), "public", "sitemap.xml");
 
-function getRoutesFromApp(dir = appDir, basePath = "") {
+// // 🔧 Utility to format URLs based on config
-  let routes = [];
+// const formatUrl = (url) => {
-  if (!fs.existsSync(dir)) return routes;
+//   if (addTrailingSlash && !url.endsWith('/')) return url + '/';
+//   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 entries = fs.readdirSync(dir, { withFileTypes: true });
+const formatUrl = (url) => {
-  for (const entry of entries) {
+  // normalize to leading slash
-    if (entry.name.startsWith("_") || entry.name === "api" || entry.name.startsWith(".")) continue;
+  if (!url.startsWith('/')) url = '/' + url;
-    const fullPath = path.join(dir, entry.name);
 
-    if (entry.isDirectory()) {
+  if (addTrailingSlash && shouldAddSlash(url) && !url.endsWith('/')) {
-      if (!entry.name.startsWith("[")) {
+    return url + '/';
-        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;
+};
 
-  return [...new Set(routes.map(r => r.replace(/\/{2,}/g, "/")))];
+// ✅ Static pages
-}
+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 },
+];
 
-async function loadESModule(relativePath) {
+// ✅ Dynamic blog posts
-  const fullPath = path.join(process.cwd(), relativePath);
+const blogPosts = [
-  if (!fs.existsSync(fullPath)) return null;
+  { slug: '5-tips-to-create-viral-content-that-drives-engagement/' },
-  const mod = await import(pathToFileURL(fullPath).href);
+  { slug: 'instagram-vs-facebook-choosing-the-right-platform-for-your-business/' },
-  return mod.default ?? mod.Blogs ?? [];
+  { slug: 'how-local-seo-can-drive-more-foot-traffic-to-your-business/' },
-}
+  { 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() {
   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);
 
+    console.log('📦 Writing URLs to sitemap:');
     allLinks.forEach(link => {
+      console.log(' -', hostname + link.url);
       sitemap.write(link);
-      console.log("✅ writing:", link.url);
     });
 
     sitemap.end();
     await streamToPromise(sitemap);
 
-    console.log(`🎉 sitemap.xml generated at ${outputPath} (${allLinks.length} URLs)`);
+    console.log('✅ sitemap.xml created successfully!');
-  } catch (err) {
+  } catch (error) {
-    console.error("❌ Failed to generate sitemap:", err);
+    console.error('❌ Error creating sitemap.xml:', error);
-    process.exit(1);
   }
 }