Merge branch 'main' of https://giteadev3.link/rankrunners-dev/next-cochise into main

public/assets/css/style-responsive.css

@@ -586,6 +586,9 @@
   .blog-item {
     margin-bottom: 50px;
   }
+  .list-bullet li {
+    list-style-type: circle;
+  }
   .blog-item-title {
     font-size: 28px;
   }

public/assets/css/style.css

@@ -238,10 +238,10 @@ Primary use: Multipurpose Template
   --gradient-primary-alpha-2: linear-gradient(90deg, transparent 13%, var(--color-primary-1) 60%);
   --border-radius-default: 4px;
   --border-radius-large: 30px;
-  --box-shadow:
+  --box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.05), 0px 1px 1px 0px rgba(0, 0, 0, 0.03),
-    0px 5px 10px 0px rgba(0, 0, 0, 0.05), 0px 1px 1px 0px rgba(0, 0, 0, 0.03), 0px 3px 5px 0px rgba(0, 0, 0, 0.03);
+    0px 3px 5px 0px rgba(0, 0, 0, 0.03);
-  --box-shadow-strong:
+  --box-shadow-strong: 0px 5px 10px 0px rgba(0, 0, 0, 0.08), 0px 1px 1px 0px rgba(0, 0, 0, 0.06),
-    0px 5px 10px 0px rgba(0, 0, 0, 0.08), 0px 1px 1px 0px rgba(0, 0, 0, 0.06), 0px 3px 5px 0px rgba(0, 0, 0, 0.06);
+    0px 3px 5px 0px rgba(0, 0, 0, 0.06);
   --box-shadow-block: 0px 3px 50px 0px rgba(0, 0, 0, 0.05);
   --box-shadow-block-strong: 0px 3px 50px 0px rgba(0, 0, 0, 0.15);
   --transition-default: all 0.27s cubic-bezier(0, 0, 0.58, 1);
@@ -10290,6 +10290,9 @@ a.link-to-top.color:before {
   position: relative;
   margin-bottom: 80px;
 }
+.list-bullet li {
+  list-style-type: disc;
+}
 .blog-item .lead,
 .blog-item blockquote p {
   font-size: 130%;

src/app/(main)/biography/[slug]/page.tsx

@@ -0,0 +1,96 @@
+import { BeforeFooterBlock } from "@/components/Blocks/BeforeFooter";
+import { fetchTeamDetail } from "@/services/payload/team";
+import { RichText } from "@payloadcms/richtext-lexical/react";
+import Image from "next/image";
+import { Suspense } from "react";
+
+export default async function BiographySinglePage({ params }: { params: Promise<{ slug: string }> }) {
+  const slug = (await params).slug;
+  const data = await fetchTeamDetail(slug);
+  if (!data?.data) return <></>;
+  return (
+    <>
+      <Suspense fallback={<Loading />}>
+        <>
+          <section className="page-section bg-dark-1 bg-gradient-gray-dark-1 light-content bg-scroll overflow-hidden">
+            {/* <!-- Background Shape --> */}
+            <div className="bg-shape-1 opacity-003">
+              <Image src="/assets/images/demo-fancy/bg-shape-1.svg" width={1300} height={844} alt="" />
+            </div>
+            {/* <!-- End Background Shape --> */}
+
+            <div className="container position-relative pt-sm-40 text-center">
+              <div className="row">
+                <div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
+                  <h1 className="hs-title-10 mb-10 wow fadeInUp">{data.data.name}</h1>
+                  {/* Author, Categories, Comments */}
+                  <div className="blog-item-data mb-0 wow fadeIn" data-wow-delay="0.2s">
+                    <div className="flex justify-center items-center">
+                      <i className="mi-clock mr-2" />
+                      <a href="#">{data.createdAt}</a>
+                    </div>
+                  </div>
+                  {/* End Author, Categories, Comments */}
+                </div>
+              </div>
+            </div>
+          </section>
+
+          {/* Section */}
+          <section className="page-section">
+            <div className="container relative">
+              <div className="row">
+                {/* Content */}
+                <div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
+                  {/* Post */}
+                  <div className="blog-item mb-80 mb-xs-40">
+                    <div className="blog-item-body">
+                      <div className="mb-40 mb-xs-30">
+                        <Image src={data.imgUrl} alt={data.data.name} width={300} height={500} className="round" />
+                      </div>
+                      <div>
+                        <RichText data={data.data.biography as any} />
+                      </div>
+                    </div>
+                  </div>
+                  {/* End Post */}
+                </div>
+                {/* End Content */}
+              </div>
+            </div>
+          </section>
+          {/* End Section */}
+        </>
+        <BeforeFooterBlock />
+      </Suspense>
+    </>
+  );
+}
+
+function Loading() {
+  return (
+    <section className="page-section animate-pulse">
+      <div className="container relative">
+        <div className="row">
+          {/* Content */}
+          <div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
+            {/* Post */}
+            <div className="blog-item mb-80 mb-xs-40">
+              <div className="blog-item-body">
+                <div className="mb-40 mb-xs-30">
+                  <div className="w-full h-72 bg-gray-300 rounded-lg"></div>
+                  <div className="h-5 bg-gray-300 rounded w-full mt-3"></div>
+                  <div className="h-5 bg-gray-300 rounded w-3/4 mt-3"></div>
+                  <div className="h-5 bg-gray-300 rounded w-2/3 mt-3"></div>
+                </div>
+                <div></div>
+              </div>
+            </div>
+            {/* End Post */}
+          </div>
+          {/* End Content */}
+        </div>
+      </div>
+    </section>
+  );
+}

src/app/(main)/home-bg-video/page.tsx

@@ -1,5 +1,5 @@
 "use client";
-import Hero from "@/components/Hero";
+import Hero6 from "@/components/Hero";
 import dynamic from "next/dynamic";
 
 const ParallaxContainer = dynamic(() => import("@/components/ParallaxContainer"), {
@@ -9,15 +9,21 @@ const ParallaxContainer = dynamic(() => import("@/components/ParallaxContainer")
 export default function Home1BGVideoMultiPage() {
   return (
     <>
-      <ParallaxContainer
+      <div className="theme-main">
-        className="home-section bg-gray-light-1 bg-light-alpha-90 parallax-5 parallax-mousemove-scene scrollSpysection"
+        <div className="page" id="top">
-        style={{
+          <main id="main">
-          backgroundImage: "url(/assets/images/full-width-images/section-bg-1.jpg)",
+            <ParallaxContainer
-        }}
+              className="home-section bg-dark-1 bg-dark-alpha-60 light-content parallax-5 scrollSpysection"
-        id="home"
+              style={{
-      >
+                backgroundImage: "url(/assets/images/full-width-images/section-bg-13.jpeg)",
-        <Hero />
+              }}
-      </ParallaxContainer>
+              id="home"
+            >
+              <Hero6 />
+            </ParallaxContainer>
+          </main>
+        </div>
+      </div>
     </>
   );
 }

src/app/(main)/layout.tsx

@@ -1,20 +1,20 @@
 "use client";
-import "@/app/globals.css";
+import { usePathname } from "next/navigation";
-import Footer from "@/components/Footer";
+import { useEffect } from "react";
-import Header from "@/components/Header";
-import { navMenuData } from "@/data/menu";
-import { headerChangeOnScroll } from "@/utils/changeHeaderOnScroll";
 import { init_wow } from "@/utils/initWow";
 import { parallaxMouseMovement, parallaxScroll } from "@/utils/parallax";
-import "@public/assets/css/styles.css";
+import { headerChangeOnScroll } from "@/utils/changeHeaderOnScroll";
-import "jarallax/dist/jarallax.min.css";
+import Header from "@/components/Header";
-import { usePathname } from "next/navigation";
+import Footer from "@/components/Footer";
-import "photoswipe/dist/photoswipe.css";
+import { navMenuData } from "@/data/menu";
-import { useEffect } from "react";
+import "@/app/globals.css";
-import "react-modal-video/css/modal-video.css";
 import "swiper/css";
+import "jarallax/dist/jarallax.min.css";
 import "swiper/css/effect-fade";
+import "react-modal-video/css/modal-video.css";
+import "photoswipe/dist/photoswipe.css";
 import "tippy.js/dist/tippy.css";
+import "@public/assets/css/styles.css";
 
 export default function MainLayout({
   children,
@@ -52,29 +52,6 @@ export default function MainLayout({
 
   return (
     <html lang="en" className="no-mobile no-touch">
-      <head>
-        <link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap" rel="stylesheet" />
-        <link
-          href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;1,400;1,500&display=swap"
-          rel="stylesheet"
-        />
-        <link
-          href="https://fonts.googleapis.com/css2?family=Epilogue:wght@400;500&family=Poppins&display=swap"
-          rel="stylesheet"
-        />
-        <link
-          href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
-          rel="stylesheet"
-        />
-        <link
-          href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;1,400&display=swap"
-          rel="stylesheet"
-        />
-        <link
-          href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;1,400&display=swap"
-          rel="stylesheet"
-        />
-      </head>
       <body className="appear-animate body">
         <div className="theme-slick">
           <div className="page" id="top">

src/components/About.tsx

@@ -0,0 +1,50 @@
+"use client";
+import Image from "next/image";
+
+export default function About() {
+  return (
+    <div className="row wow fadeInUp" data-wow-delay="0.5s">
+      <div className="col-lg-6 mb-md-60">
+        <div className="position-relative">
+          {/* Image */}
+          <div className="position-relative overflow-hidden">
+            <Image
+              width={960}
+              height={539}
+              src="/assets/images/about-image.webp"
+              className="image-fullwidth relative"
+              alt="Image Description"
+            />
+          </div>
+          {/* End Image */}
+          {/* Decorative Waves */}
+          <div
+            className="decoration-1 d-none d-sm-block"
+            data-rellax-y=""
+            data-rellax-speed={1}
+            data-rellax-percentage="0.1"
+          >
+            <Image width="159" height="74" src="/assets/images/decoration-1.svg" className="svg-shape" alt="" />
+          </div>
+          {/* End Decorative Waves */}
+        </div>
+      </div>
+      <div className="col-lg-6 col-xl-5 offset-xl-1">
+        <h4 className="h5">What is Radixact® Radiation Therapy?</h4>
+        <p className="text-gray">
+          Radixact® is an advanced form of radiation therapy that targets a wide range of cancers. Radixact® is a form
+          of TomoTherapy®, a system of CT imaging that provides 3D images of the tumor, then targets it more precisely
+          to minimize the effects on healthy tissue. It also works from all directions to treat tumors more effectively
+          from multiple angles.
+        </p>
+        <h4 className="h5">What are the Side Effects of Radixact®?</h4>
+        <p className="text-gray">
+          Radixact® reduces many of the common after-effects of radiation therapy by protecting healthy tissue. Common
+          side effects of radiation therapy include fatigue and local skin irritation in the treatment area. Radixact®
+          decreases the occurrence of these problems by leaving healthy tissue as untouched as possible. Radixact®
+          patients usually go about their daily lives during treatment with minimal disruption.
+        </p>
+      </div>
+    </div>
+  );
+}

src/components/Blocks/GoogleReviews/index.tsx

@@ -64,13 +64,13 @@ export function GoogleReviewsBlock() {
       </div>
 
       <div className="container px-6">
-        <h2 className="text-3xl font-bold text-center text-white">Reviews</h2>
+        <h2 className="text-3xl font-bold text-cente">Reviews</h2>
         <div className="flex justify-center space-x-2">
-          <h2 className="text-xl text-center font-bold text-white">4.8</h2>
+          <h2 className="text-xl text-center font-bol">4.8</h2>
           <div className="mt-1">
             <StarRating size={20} value={4.8} />
           </div>
-          <div className="text-xs font-semibold mt-1 text-white">Over 200 Reviews</div>
+          <div className="text-xs font-semibold mt-">Over 200 Reviews</div>
         </div>
         <div className="mt-20 relative">
           <Swiper

src/components/HeaderNav.tsx

@@ -4,7 +4,6 @@ import addScrollspy from "@/utils/addScroll";
 import { init_classic_menu_resize } from "@/utils/menuToggle";
 import { scrollToElement } from "@/utils/scrollToElement";
 import { closeMobileMenu, toggleMobileMenu } from "@/utils/toggleMobileMenu";
-import { usePathname } from "next/navigation";
 import { useEffect, useRef, useState } from "react";
 import Link from "next/link";
 
@@ -33,7 +32,6 @@ export default function HeaderNav({ links, animateY = false }: any) {
       window.removeEventListener("resize", init_classic_menu_resize);
     };
   }, []);
-  const pathname = usePathname();
 
   return (
     <>
@@ -41,7 +39,7 @@ export default function HeaderNav({ links, animateY = false }: any) {
         links.map((link: any, index: any) => (
           <li key={index}>
             {!Array.isArray(link?.child) && (
-              <Link className={pathname.split("/")[1] == link.href.split("/")[1] ? "active" : ""} href={link.href}>
+              <Link href={link.href}>
                 {animateY ? (
                   <span className="btn-animate-y">
                     <span className="btn-animate-y-1">{link.text}</span>

src/components/Hero.tsx

@@ -1,64 +1,63 @@
 "use client";
 
-import { useRef } from "react";
+import ModalVideo from "react-modal-video";
-import Link from "next/link";
+import { useState } from "react";
 
 export default function Hero6() {
-  const videoRef = useRef<any | null>(null);
+  const [isOpen, setOpen] = useState(false);
-
   return (
-    <section className="home-section bg-dark-1 bg-dark-alpha-30 light-content scrollSpysection" id="home">
+    <>
-      <div className="container min-height-100vh d-flex align-items-center pt-100 pb-100 pt-sm-120 pb-sm-120">
+      <div className="container min-height-80vh d-flex align-items-center pt-100 pb-100 pt-sm-120 pb-sm-120">
-        {/* Background Video */}
-        {/* Please replace the video file in folder "video" with your own file */}
-        <div className="bg-video-wrapper">
-          <video ref={videoRef} className="bg-video" preload="auto" autoPlay muted loop>
-            <source src="/assets/videos/cochise.webm" type="video/webm" />
-          </video>
-          <div className="bg-video-overlay bg-dark-alpha-50" />
-        </div>
         {/* Home Section Content */}
         <div className="home-content">
           <div className="row">
             {/* Home Section Text */}
-            <div className="col-md-10 offset-md-1 mb-20 mb-sm-0">
+            <div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
-              <h2 className="hs-title-11 mb-30 mb-xs-10 wow fadeInUp">Healing Begins Here</h2>
+              <h2 className="section-caption mb-30 mb-xs-10" data-wow-duration="1.2s">
-              <h1 className="hs-title-12 mb-50 mb-sm-30">
+                Healing Begins Here
-                <span className="wow charsAnimIn" data-splitting="chars">
+              </h2>
+              <h1 className="hs-title-1 mb-30">
+                <span className="" data-splitting="chars">
                   Cochise Oncology
                 </span>
               </h1>
-              <p className="section-descr mb-50 wow fadeInUp" data-wow-delay="0.6s" data-wow-duration="1.2s">
+              <div className="row">
-                Southern Arizona’s Only Complete Cancer Treatment Center in Sierra Vista.
+                <div className="col-lg-8 offset-lg-2">
-              </p>
+                  <p className="section-descr mb-50" data-wow-delay="0.6s" data-wow-duration="1.2s">
-              <div className="local-scroll wch-unset wow fadeInUp" data-wow-delay="0.4s">
+                    Southern Arizona’s Only Complete Cancer Treatment Center in Sierra Vista
-                <a
+                  </p>
-                  href="#about"
+                </div>
-                  className="btn btn-mod btn-border-w btn-large btn-round ms-1 me-1 mt-2 align-middle w-full md:w-1/4"
+              </div>
-                  data-btn-animate="y"
+              <div
+                className="local-scroll mt-n10 wch-unset"
+                data-wow-delay="0.7s"
+                data-wow-duration="1.2s"
+                data-wow-offset={0}
+              >
+                <button className="bg-[#64B3B4] text-white px-4 py-2 m-3 rounded-3xl hover:opacity-[0.7]">
+                  Request Consultation
+                </button>
+                {/* <a
+                  onClick={() => setOpen(true)}
+                  className="link-hover-anim align-middle lightbox mfp-iframe mt-10"
+                  data-link-animate="y"
                 >
-                  Learn More
+                  <i className="icon-play size-13 me-1" /> How it works?
-                </a>
+                </a> */}
-                <Link href="/contact">
-                  <button className="btn btn-mod btn-w btn-border-w btn-round btn-large btn-hover-anim ms-1 me-1 mt-2 align-middle w-full md:w-1/4">
-                    <span>Request Consultation</span>
-                  </button>
-                </Link>
               </div>
             </div>
             {/* End Home Section Text */}
           </div>
         </div>
         {/* End Home Section Content */}
-        {/* Scroll Down */}
+      </div>{" "}
-        <div className="local-scroll scroll-down-wrap wow fadeInUp" data-wow-offset={0}>
+      <ModalVideo
-          <a href="#about" className="scroll-down">
+        channel="youtube"
-            <i className="mi-chevron-down" />
+        youtube={{ mute: 0, autoplay: 0 }}
-            <span className="visually-hidden">Scroll to the next section</span>
+        isOpen={isOpen}
-          </a>
+        videoId="jTea_8Fk5Ns"
-        </div>
+        onClose={() => setOpen(false)}
-        {/* End Scroll Down */}
+      />{" "}
-      </div>
+    </>
-    </section>
   );
 }

src/components/Homepage.tsx

@@ -2,8 +2,8 @@ import { features4 } from "@/data/features";
 import Image from "next/image";
 import Link from "next/link";
 import Cta3 from "./cta3";
-import Service from "./Service";
+import Testimonials from "./Testimonials";
-import { GoogleReviewsBlock } from "./Blocks/GoogleReviews";
+import About from "./About";
 
 export default function homepage({ onePage = false, dark = false }) {
   return (
@@ -95,34 +95,9 @@ export default function homepage({ onePage = false, dark = false }) {
           </div>
         </div>
       </section>
-      <section className={`small-section bg-dark ps-4 ps-lg-0 pe-4 pe-lg-0 position-relative overflow-hidden`}>
+      <section className="my-5 w-full">
-        <div className="decoration-12 bg-white" />
+        <Testimonials />
-        <div className="decoration-13 bg-white" />
-        <div className="col-md-10 offset-md-1 col-lg-8 offset-lg-2 col-xl-6 offset-xl-3 text-center text-white mb-50">
-          <h2 className="section-title-small">Testimonials</h2>
-        </div>
-        <GoogleReviewsBlock />
       </section>
-      <section className={`page-section  scrollSpysection  ${dark ? "bg-dark-1 light-content" : ""} `} id="services">
-        <div className="container position-relative">
-          <div className="row">
-            {/* Left Column */}
-            <div className="col-lg-5 mb-md-60 mb-sm-40">
-              <h2 className="section-caption-slick mb-30 mb-sm-20">Our Services</h2>
-              <h3 className="section-title mb-30">A Cancer Treatment Center of Excellence.</h3>
-              <p className="section-descr mb-50 mb-sm-40">
-                Get compassionate care and excellent medical services from COCHISE ONCOLOGY in Sierra Vista, Arizona.
-              </p>
-            </div>
-            {/* End Left Column */}
-            {/* Right Column */}
-            <Service />
-            {/* End Right Column */}
-          </div>
-        </div>
-      </section>
-
-      <hr className={`mt-0 mb-0 ${dark ? "white" : ""} `} />
       <section
         className="page-section bg-scroll light-content"
         style={{
@@ -136,13 +111,24 @@ export default function homepage({ onePage = false, dark = false }) {
         {/* End Mobile Overlay */}
         <div className="container position-relative">
           <div className="row wow fadeInUp">
-            <div className="col-md-7 offset-md-5 col-lg-6 offset-lg-6 col-xl-5 offset-xl-7">
+            <div className="col-md-2 offset-md-5 col-lg-6 offset-lg-6 col-xl-7 offset-xl-7">
               <h2 className="section-title mb-40 mb-sm-30">A Cancer Treatment Center of Excellence</h2>
-              <p className="mb-50 mb-sm-40">
+              <p className="text-sm">
-                We believe our patients deserve and demand the very best in timely treatments, personalized care,
+                Get compassionate care and excellent medical services from COCHISE ONCOLOGY in Sierra Vista, Arizona. We
-                professional competence, and advanced technology. We will achieve this vision by employing caring and
+                are the largest full-service cancer treatment center between Albuquerque, New Mexico and Tucson,
-                competent staff with excellent training, developing multidisciplinary collaborations, and using the
+                Arizona. Our services cover radiation treatments as well as chemotherapy, and we also have an infusion
-                latest technology available in the most comfortable environment.
+                center. We offer support groups as well as free hospitality housing for patients undergoing treatment.
+                Read on to learn more about our establishment, or reach out to us via phone or email to make an inquiry.
+              </p>
+              <h4>The Mission of Cochise Oncology</h4>
+              <p className="text-sm">
+                To provide excellence in cancer and patient care in a comprehensive center for the local community.
+                Optimal cancer treatment places the patient first—from the patient’s first greeting with the front
+                office staff to the trust they develop with the physicians and the whole treatment team. We believe our
+                patients deserve and demand the very best in timely treatments, personalized care, professional
+                competence, and advanced technology. We will achieve this vision by employing caring and competent staff
+                with excellent training, developing multidisciplinary collaborations, and using the latest technology
+                available in the most comfortable environment.
               </p>
 
               {/* Features List */}
@@ -152,6 +138,39 @@ export default function homepage({ onePage = false, dark = false }) {
           </div>
         </div>
       </section>
+
+      <section className={`page-section scrollSpysection ${dark ? "bg-dark-1 light-content" : ""}`} id="about">
+        <div className="container position-relative">
+          <div className="row mb-60 mb-xs-30">
+            <div className="col-md-6">
+              <h2 className="section-caption mb-xs-10">Our Service</h2>
+              <h3 className="section-title mb-0">Radixact® Radiation Therapy</h3>
+            </div>
+            <div className="col-md-5 offset-md-1 relative text-start text-md-end pt-40 pt-sm-20 local-scroll">
+              {/* Decorative Dots */}
+              <div
+                className="decoration-2 d-none d-md-block"
+                data-rellax-y=""
+                data-rellax-speed="0.7"
+                data-rellax-percentage="-0.2"
+              >
+                <Image width="103" height="223" src="/assets/images/decoration-2.svg" alt="" />
+              </div>
+              {/* End Decorative Dots */}
+
+              <Link href={`/radixact`} className="link-hover-anim underline align-middle" data-link-animate="y">
+                <span className="link-strong link-strong-unhovered">
+                  Explore Radixact® <i className="mi-arrow-right size-18" aria-hidden="true"></i>
+                </span>
+                <span className="link-strong link-strong-hovered" aria-hidden="true">
+                  Explore Radixact® <i className="mi-arrow-right size-18" aria-hidden="true"></i>
+                </span>
+              </Link>
+            </div>
+          </div>
+          <About />
+        </div>
+      </section>
     </>
   );
 }

src/components/SplashScreen.tsx

@@ -1,52 +0,0 @@
-import React, { useEffect, useState } from "react";
-import Image from "next/image";
-import anime from "animejs";
-
-interface SplashScreenProps {
-  finishLoading: () => void;
-}
-
-const SplashScreen: React.FC<SplashScreenProps> = ({ finishLoading }) => {
-  const [isMounted, setIsMounted] = useState(false);
-
-  const animate = () => {
-    const loader = anime.timeline({
-      complete: () => finishLoading(),
-    });
-
-    loader
-      .add({
-        targets: "#logo",
-        delay: 0,
-        scale: 1,
-        duration: 500,
-        easing: "easeInOutExpo",
-      })
-      .add({
-        targets: "#logo",
-        delay: 0,
-        scale: 1.25,
-        duration: 500,
-        easing: "easeInOutExpo",
-      });
-  };
-
-  useEffect(() => {
-    const timeout = setTimeout(() => {
-      setIsMounted(true);
-    }, 10);
-
-    animate();
-    return () => clearTimeout(timeout);
-  }, []);
-
-  return isMounted ? (
-    <div className="flex h-screen items-center justify-center">
-      <Image id="logo" src={"/assets/images/demo-slick/logo-dark.webp"} alt="" width={500} height={500} />
-    </div>
-  ) : (
-    <></>
-  );
-};
-
-export default SplashScreen;

src/components/Team.tsx

@@ -1,25 +1,28 @@
 "use client";
+import Link from "next/link";
 import { CardTeam } from "./Teams/CardTeam";
 
 export default function Team({ data }: any) {
   return (
     <div className="container">
-      <div className="row mb-70 mb-sm-50">
+      <div className="row">
         <div className="col-md-12 offset-md-2 col-lg-6 offset-lg-3 text-center">
           <h2 className="section-title mb-30 mb-sm-20">
             <span className="text-gray">Our</span> Team
             <span className="text-gray">.</span>
           </h2>
-          <div className="text-gray">
-            The same color can evoke different emotions, or have various meanings to different individuals and cultures.
-          </div>
         </div>
       </div>
-      <div className="row mt-n40">
+      <div className="grid grid-cols-4 gap-5">
         {/* Team item */}
         {data.map((member: any, index: any) => (
-          <div key={index}>
+          <div key={index} className="text-center">
             <CardTeam data={member} />
+            <Link href={`/biography/${member.name}`} passHref>
+              <button className="bg-[#64B3B4] text-white px-2 py-1 m-3 rounded-3xl hover:opacity-[0.7]">
+                Biography
+              </button>
+            </Link>
           </div>
         ))}
         {/* End Team item */}

src/components/Teams/CardTeam.tsx

@@ -10,7 +10,7 @@ export interface CardTeamProps {
 
 export function CardTeam({ data }: CardTeamProps) {
   return (
-    <div className="col-md-4 mt-40">
+    <div className="col-md-12 mt-40">
       <div className="team-item">
         <div className="team-item-image">
           <Image

src/components/Testimonials.tsx

@@ -1,11 +1,6 @@
 "use client";
-import { brands } from "@/data/brands";
-import { numberItems4 } from "@/data/facts";
-import { testimonials5 } from "@/data/testimonials";
 import { useEffect, useRef } from "react";
-import { Autoplay } from "swiper/modules";
+import { GoogleReviewsBlock } from "./Blocks/GoogleReviews";
-import { Swiper, SwiperSlide } from "swiper/react";
-import Image from "next/image";
 
 export default function Testimonials() {
   const isotopContainer = useRef<any | null>(null);
@@ -15,7 +10,7 @@ export default function Testimonials() {
 
     const isotope = new Isotope(isotopContainer.current, {
       itemSelector: ".col-md-6",
-      layoutMode: "masonry", 
+      layoutMode: "masonry",
     });
     imagesloaded(isotopContainer.current).on("progress", function () {
       isotope.layout();
@@ -26,120 +21,12 @@ export default function Testimonials() {
     initIsotop();
   }, []);
   return (
-    <div className="container position-relative">
+    <div className="text-center">
       <div className="row">
-        {/* Section Text */}
+        <div className="flex align-items-center justify-center wow fadeInUp">
-        <div className="col-lg-5 col-xl-5 d-flex align-items-center mb-md-60 mb-sm-40">
+          <GoogleReviewsBlock />
-          <div className="w-100">
-            <h2 className="section-caption-slick mb-30 mb-sm-20">
-              Testimonials
-            </h2>
-            <h3 className="section-title mb-30">
-              We&apos;re trusted by leading companies.
-            </h3>
-            <p className="section-descr mb-50 mb-sm-30">
-              A static website stores a unique file for every page of a static
-              website. Each time that page is requested, the same content is
-              returned.
-            </p>
-            {/* Numbers */}
-            <div className="row mt-sm-n10">
-              {numberItems4.map((item, index) => (
-                <div key={index} className="col-md-6 mt-sm-10">
-                  <div className="number-3-title">{item.title}</div>
-                  <div className="number-3-descr">{item.description}</div>
-                </div>
-              ))}
-            </div>
-            {/* End Numbers */}
-          </div>
         </div>
-        {/* End Section Text */}
-        {/* Testimonials Grid */}
-        <div className="col-lg-7 col-xl-6 offset-xl-1 d-flex align-items-center">
-          <div className="w-100 position-relative">
-            <div
-              ref={isotopContainer}
-              className="row masonry mb-n30 wow fadeInUp"
-            >
-              {/* Testimonials Item */}
-              {testimonials5.map((testimonial: any, index: number) => (
-                <div
-                  key={index}
-                  className={`col-md-6 mb-30 ${!index ? "mt-50 mt-sm-0" : ""} `}
-                >
-                  <div className="testimonials-4-item">
-                    <div className="testimonials-4-icon">
-                      <i className="icon-quotation-mark" />
-                    </div>
-                    <blockquote className="testimonials-4-text">
-                      <p className="mb-0">{testimonial.text}</p>
-                      <footer className="testimonials-4-author mt-30 clearfix">
-                        <div className="testimonials-4-author-img float-start">
-                          <Image
-                            width={44}
-                            height={44}
-                            src={testimonial.imgSrc}
-                            alt={testimonial.altText}
-                          />
-                        </div>
-                        <div className="overflow-hidden">
-                          {testimonial.author}
-                          <div className="small">{testimonial.position}</div>
-                        </div>
-                      </footer>
-                    </blockquote>
-                  </div>
-                </div>
-              ))}
-
-              {/* End Testimonials Item */}
-            </div>
-          </div>
-        </div>
-        {/* Testimonials Grid */}
       </div>
-      {/* Logotypes */}
-      <div className="page-section pb-0 text-center">
-        <h3 className="section-title-tiny">Trusted by Leading Companies</h3>
-        <Swiper
-          spaceBetween={0}
-          slidesPerView={6}
-          breakpoints={{
-            1199: {
-              slidesPerView: 6, // When window width is <= 1199px
-            },
-
-            768: {
-              slidesPerView: 4, // When window width is <= 768px
-            },
-            0: {
-              slidesPerView: 2, // When window width is <= 480px
-            },
-          }}
-          watchSlidesProgress
-          modules={[Autoplay]}
-          autoplay
-          resizeObserver
-          className="small-item-carousel black owl-carousel mb-0 owl-theme overflow-hidden position-static"
-          style={{
-            opacity: 1,
-            display: "block",
-          }}
-        >
-          {/* Team item */}
-          {brands.map((elm: any, i: number) => (
-            <SwiperSlide className="owl-item" key={i}>
-              <div className="logo-item">
-                <Image src={elm} width={215} height={75} alt="Company Name" />
-              </div>
-            </SwiperSlide>
-          ))}
-
-          {/* End Team item */}
-        </Swiper>
-      </div>
-      {/* End Logotypes */}
     </div>
   );
 }

src/data/menu.ts

@@ -1,5 +1,8 @@
 export const navMenuData = [
   { href: "/", text: "Home" },
+  { href: "/blog", text: "Blog" },
+  { href: "/testimonials", text: "Testimonials" },
+  { href: "https://cochise.mdnavigatorclinical.com/prognocistc1/cochiseClinicIndex.html", text: "Patient Portal" },
   {
     href: "#",
     text: "About",
@@ -69,14 +72,11 @@ export const navMenuData = [
     href: "#",
     text: "Resources",
     child: [
-      { href: "/testimonials", text: "Testimonials" },
       { href: "/insurances", text: "Insurances" },
       { href: "/support", text: "Support Groups" },
       { href: "/hospitality-house", text: "Hospitality House" },
       { href: "/in-house-lab", text: "In-House Lab" },
       { href: "/american-cancer-society", text: "American Cancer Society" },
-      { href: "/#", text: "Patient Portal" },
-      { href: "/blog", text: "Blog" },
     ],
   },
 ];

src/data/testimonials.ts

@@ -1,169 +1,168 @@
 export const testimonials = [
-    {
+  {
-      quote: `This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality. The support is one of the absolute best I've ever had the pleasure of interacting with. Quick, courteous, and extremely helpful!`,
+    quote: `This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality. The support is one of the absolute best I've ever had the pleasure of interacting with. Quick, courteous, and extremely helpful!`,
-      author: "Adam Peterson",
+    author: "Adam Peterson",
-      role: "Business Owner",
+    role: "Business Owner",
-      image: "/assets/images/ts1-user.jpg",
+    image: "/assets/images/ts1-user.jpg",
+  },
+  {
+    quote: `This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality. The support is one of the absolute best I've ever had the pleasure of interacting with. Quick, courteous, and extremely helpful!`,
+    author: "Adam Peterson",
+    role: "Business Owner",
+    image: "/assets/images/ts1-user.jpg",
+  },
+  {
+    quote: `This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality. The support is one of the absolute best I've ever had the pleasure of interacting with. Quick, courteous, and extremely helpful!`,
+    author: "Adam Peterson",
+    role: "Business Owner",
+    image: "/assets/images/ts1-user.jpg",
+  },
+];
+
+export const testimonials2 = [
+  {
+    id: 1,
+    blockquote:
+      "Beautifull template, nice code and easy to customize. Optimization and structure are very good for seo basics.",
+    author: {
+      name: "Adam Peterson",
+      title: "Business Owner",
+      imgSrc: "/assets/images/ts1-user.jpg",
     },
-    {
+  },
-      quote: `This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality. The support is one of the absolute best I've ever had the pleasure of interacting with. Quick, courteous, and extremely helpful!`,
+  {
-      author: "Adam Peterson",
+    id: 2,
-      role: "Business Owner",
+    blockquote:
-      image: "/assets/images/ts1-user.jpg",
+      "Beautifull template, nice code and easy to customize. Optimization and structure are very good for seo basics.",
+    author: {
+      name: "Adam Peterson",
+      title: "Business Owner",
+      imgSrc: "/assets/images/ts1-user.jpg",
     },
-    {
+  },
-      quote: `This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality. The support is one of the absolute best I've ever had the pleasure of interacting with. Quick, courteous, and extremely helpful!`,
+  {
-      author: "Adam Peterson",
+    id: 3,
-      role: "Business Owner",
+    blockquote:
-      image: "/assets/images/ts1-user.jpg",
+      "Beautifull template, nice code and easy to customize. Optimization and structure are very good for seo basics.",
+    author: {
+      name: "Adam Peterson",
+      title: "Business Owner",
+      imgSrc: "/assets/images/ts1-user.jpg",
     },
-  ];
+  },
-  
+];
-  export const testimonials2 = [
+
-    {
+export const testimonials3 = [
-      id: 1,
+  {
-      blockquote:
+    text: "Beautiful template, nice code and easy to customize. Optimization, structure and pages are very good for SEO basics.",
-        "Beautifull template, nice code and easy to customize. Optimization and structure are very good for seo basics.",
+    author: "Thomas Johnson",
-      author: {
+    role: "UI/UX designer",
-        name: "Adam Peterson",
+    imgSrc: "/assets/images/demo-gradient/user-1.jpg",
-        title: "Business Owner",
+  },
-        imgSrc: "/assets/images/ts1-user.jpg",
+  {
-      },
+    text: "This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality.",
-    },
+    author: "Alice Watson",
-    {
+    role: "3D artist",
-      id: 2,
+    imgSrc: "/assets/images/demo-gradient/user-2.jpg",
-      blockquote:
+  },
-        "Beautifull template, nice code and easy to customize. Optimization and structure are very good for seo basics.",
+  {
-      author: {
+    text: "A remarkable model, everything has been thought out with talent, the design, the responsiveness, the various adaptations.",
-        name: "Adam Peterson",
+    author: "Peter Braun",
-        title: "Business Owner",
+    role: "Business owner",
-        imgSrc: "/assets/images/ts1-user.jpg",
+    imgSrc: "/assets/images/demo-gradient/user-3.jpg",
-      },
+  },
-    },
+  {
-    {
+    text: "Beautiful template, nice code and easy to customize. Optimization, structure and pages are very good for SEO basics.",
-      id: 3,
+    author: "Thomas Johnson",
-      blockquote:
+    role: "UI/UX designer",
-        "Beautifull template, nice code and easy to customize. Optimization and structure are very good for seo basics.",
+    imgSrc: "/assets/images/demo-gradient/user-1.jpg",
-      author: {
+  },
-        name: "Adam Peterson",
+  {
-        title: "Business Owner",
+    text: "This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality.",
-        imgSrc: "/assets/images/ts1-user.jpg",
+    author: "Alice Watson",
-      },
+    role: "3D artist",
-    },
+    imgSrc: "/assets/images/demo-gradient/user-2.jpg",
-  ];
+  },
-  
+  {
-  export const testimonials3 = [
+    text: "A remarkable model, everything has been thought out with talent, the design, the responsiveness, the various adaptations.",
-    {
+    author: "Peter Braun",
-      text: "Beautiful template, nice code and easy to customize. Optimization, structure and pages are very good for SEO basics.",
+    role: "Business owner",
-      author: "Thomas Johnson",
+    imgSrc: "/assets/images/demo-gradient/user-3.jpg",
-      role: "UI/UX designer",
+  },
-      imgSrc: "/assets/images/demo-gradient/user-1.jpg",
+];
-    },
+
-    {
+export const testimonials4 = [
-      text: "This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality.",
+  {
-      author: "Alice Watson",
+    id: 1,
-      role: "3D artist",
+    delay: "0s",
-      imgSrc: "/assets/images/demo-gradient/user-2.jpg",
+    stars: 4.5,
-    },
+    text: "“Really impressed with the service and the results!”",
-    {
+    caption: "Rated 4.5 on Trustpilot",
-      text: "A remarkable model, everything has been thought out with talent, the design, the responsiveness, the various adaptations.",
+  },
-      author: "Peter Braun",
+  {
-      role: "Business owner",
+    id: 2,
-      imgSrc: "/assets/images/demo-gradient/user-3.jpg",
+    delay: "0.15s",
-    },
+    stars: 4.5,
-    {
+    text: "“Excellent service for targeted lead generation.”",
-      text: "Beautiful template, nice code and easy to customize. Optimization, structure and pages are very good for SEO basics.",
+    caption: "Rated 4.5 on Trustpilot",
-      author: "Thomas Johnson",
+  },
-      role: "UI/UX designer",
+  {
-      imgSrc: "/assets/images/demo-gradient/user-1.jpg",
+    id: 3,
-    },
+    delay: "0.3s",
-    {
+    stars: 4.5,
-      text: "This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality.",
+    text: "“I have super enjoyed working with Resonance.”",
-      author: "Alice Watson",
+    caption: "Rated 4.5 on Trustpilot",
-      role: "3D artist",
+  },
-      imgSrc: "/assets/images/demo-gradient/user-2.jpg",
+];
-    },
+
-    {
+export const testimonialItems = [
-      text: "A remarkable model, everything has been thought out with talent, the design, the responsiveness, the various adaptations.",
+  {
-      author: "Peter Braun",
+    imageSrc: "/assets/images/demo-corporate/testimonial-1.jpg",
-      role: "Business owner",
+    quote:
-      imgSrc: "/assets/images/demo-gradient/user-3.jpg",
+      "This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality. The support is the absolute best I've ever had the pleasure of interacting with. Quick, courteous, premium and extremely helpful!",
-    },
+    author: "Adam Peterson",
-  ];
+    position: "Marketing Consultant",
-  
+  },
-  export const testimonials4 = [
+  {
-    {
+    imageSrc: "/assets/images/demo-corporate/testimonial-2.jpg",
-      id: 1,
+    quote:
-      delay: "0s",
+      "Optimization and structure are very good for SEO basics. A remarkable model, everything has been thought out with talent, the design, the various adaptations. Beautiful template, nice code and easy to customize.",
-      stars: 4.5,
+    author: "Jordan Harvey",
-      text: "“Really impressed with the service and the results!”",
+    position: "SEO/SMO Expert",
-      caption: "Rated 4.5 on Trustpilot",
+  },
-    },
+];
-    {
+
-      id: 2,
+export const testimonials5 = [
-      delay: "0.15s",
+  {
-      stars: 4.5,
+    text: "Beautifull template, nice code and easy to customize. Optimization and structure are verry good for SEO basics.",
-      text: "“Excellent service for targeted lead generation.”",
+    author: "Thomas Johnson",
-      caption: "Rated 4.5 on Trustpilot",
+    position: "UI/ UX Designer",
-    },
+    imgSrc: "/assets/images/demo-fancy/user-1.jpg",
-    {
+    altText: "Image description is here",
-      id: 3,
+    extraClass: "mt-50 mt-sm-0",
-      delay: "0.3s",
+  },
-      stars: 4.5,
+  {
-      text: "“I have super enjoyed working with Resonance.”",
+    text: "The support is one of the absolute best I've ever had the pleasure of interacting with. Quick, courteous, and extremely helpful!",
-      caption: "Rated 4.5 on Trustpilot",
+    author: "Emma Kande",
-    },
+    position: "3D Artist",
-  ];
+    imgSrc: "/assets/images/demo-fancy/user-2.jpg",
-  
+    altText: "Image description is here",
-  export const testimonialItems = [
+    extraClass: "",
-    {
+  },
-      imageSrc: "/assets/images/demo-corporate/testimonial-1.jpg",
+  {
-      quote:
+    text: "This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality.",
-        "This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality. The support is the absolute best I've ever had the pleasure of interacting with. Quick, courteous, premium and extremely helpful!",
+    author: "Peter Rebel",
-      author: "Adam Peterson",
+    position: "Business Owner",
-      position: "Marketing Consultant",
+    imgSrc: "/assets/images/demo-fancy/user-3.jpg",
-    },
+    altText: "Image description is here",
-    {
+    extraClass: "",
-      imageSrc: "/assets/images/demo-corporate/testimonial-2.jpg",
+  },
-      quote:
+  {
-        "Optimization and structure are very good for SEO basics. A remarkable model, everything has been thought out with talent, the design, the various adaptations. Beautiful template, nice code and easy to customize.",
+    text: "A remarkable model, everything has been thought out with talent, the design, the responsiveness, the various adaptations.",
-      author: "Jordan Harvey",
+    author: "Alice Watson",
-      position: "SEO/SMO Expert",
+    position: "Product Designer",
-    },
+    imgSrc: "/assets/images/demo-fancy/user-4.jpg",
-  ];
+    altText: "Image description is here",
-  
+    extraClass: "",
-  export const testimonials5 = [
+  },
-    {
+];
-      text: "Beautifull template, nice code and easy to customize. Optimization and structure are verry good for SEO basics.",
-      author: "Thomas Johnson",
-      position: "UI/ UX Designer",
-      imgSrc: "/assets/images/demo-fancy/user-1.jpg",
-      altText: "Image description is here",
-      extraClass: "mt-50 mt-sm-0",
-    },
-    {
-      text: "The support is one of the absolute best I've ever had the pleasure of interacting with. Quick, courteous, and extremely helpful!",
-      author: "Emma Kande",
-      position: "3D Artist",
-      imgSrc: "/assets/images/demo-fancy/user-2.jpg",
-      altText: "Image description is here",
-      extraClass: "",
-    },
-    {
-      text: "This template is so beautiful and has such wonderful new options. It is updated often which gives me even more quality.",
-      author: "Peter Rebel",
-      position: "Business Owner",
-      imgSrc: "/assets/images/demo-fancy/user-3.jpg",
-      altText: "Image description is here",
-      extraClass: "",
-    },
-    {
-      text: "A remarkable model, everything has been thought out with talent, the design, the responsiveness, the various adaptations.",
-      author: "Alice Watson",
-      position: "Product Designer",
-      imgSrc: "/assets/images/demo-fancy/user-4.jpg",
-      altText: "Image description is here",
-      extraClass: "",
-    },
-  ];
-  

src/services/payload/team.ts

@@ -0,0 +1,27 @@
+import payloadConfig from "@/payload.config";
+import { formatDate } from "@/utils/datetime";
+import { getPayload } from "payload";
+
+export async function fetchTeamDetail(name: string | undefined) {
+  const payload = await getPayload({ config: payloadConfig });
+  const blogDataQuery = await payload.find({
+    collection: "teams",
+    where: {
+      name: { like: `%${name}%` },
+    },
+    limit: 1,
+    pagination: false,
+  });
+
+  if (!blogDataQuery?.docs?.[0]) return null;
+
+  const data = blogDataQuery?.docs?.[0];
+  const createdAt = formatDate(data.createdAt);
+  const imgUrl = typeof data.img !== "number" ? (data?.img?.url ?? "") : "";
+
+  return {
+    data,
+    createdAt,
+    imgUrl,
+  };
+}