rapharehap/app/caregivers/CaregiversPage.js

284 lines
18 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

'use client'
import Layout from "@/components/layout/Layout";
import Link from "next/link";
import { useState } from 'react';
import Image from "next/image";
import { teamMembers } from "@/utils/constant.utils";
export default function Home() {
const [isActive, setIsActive] = useState({
status: false,
key: 1,
})
const handleToggle = (key) => {
if (isActive.key === key) {
setIsActive({
status: false,
})
} else {
setIsActive({
status: true,
key,
})
}
}
return (
<>
<Layout headerStyle={1} footerStyle={1} breadcrumbTitle="Caregivers" bannerImage="/assets/images/caregivers/caregivers-banner.webp">
<section className="feature-section pt_90 pb_90">
<div className="shape hide-element">
<Image
// loader={exportableLoader}
src="/assets/images/shape/shape-6.png"
alt="Physiotherapy at Rapharehab"
fill
style={{ objectFit: "cover" }}
/>
</div>
<div className="auto-container">
<div className="sec-title centred mb_50">
<span className="sub-title">Caregivers</span>
<h2>We Dont Just Give Care - <br />We Take Care as Well</h2>
</div>
<div className="row clearfix">
<div className="col-lg-4 col-md-6 col-sm-12 feature-block">
<div className="feature-block-one">
<div className="inner-box">
<div className="icon-box"><img src="/assets/images/caregivers/caring.webp" alt="Caring with a smile" /></div>
<h3>Caring with a Smile</h3>
<p>At RaphaRehab, care is not just a service - its an experience. Our caregivers bring warmth, positivity, and a genuine smile to every interaction. A simple smile can uplift a day, ease stress, and make healing feel lighter - and thats exactly the kind of comfort we aim to bring to your home.</p>
</div>
</div>
</div>
<div className="col-lg-4 col-md-6 col-sm-12 feature-block">
<div className="feature-block-one">
<div className="inner-box">
<div className="icon-box"><img src="/assets/images/caregivers/attentive.webp" alt="Attentive listener" /></div>
<h3>Attentive Listener</h3>
<p>Your comfort begins with being heard. Our caregivers take the time to understand your routines, preferences, and expectations. From how you like things arranged to where you enjoy going, we listen closely so we can offer support that truly fits your lifestyle. Every conversation helps us create the perfect caregiverclient match.</p>
</div>
</div>
</div>
<div className="col-lg-4 col-md-6 col-sm-12 feature-block">
<div className="feature-block-one">
<div className="inner-box">
<div className="icon-box"><img src="/assets/images/caregivers/qualified.webp" alt="Qualified" /></div>
<h3>Qualified & Trustworthy</h3>
<p>Whether you need companionship, mobility support, or more complex personal care, our caregivers are trained, experienced, and carefully vetted. We ensure every caregiver meets high standards of safety, professionalism, and compassion - so you receive care that is not only dependable but also meaningful.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section className="about-style-three pt_90 pb_90 bg-color-1">
<div className="pattern-layer hide-element" style={{ backgroundImage: 'url(/assets/images/shape/shape-35.webp)' }}></div>
<div className="auto-container">
<div className="row clearfix">
{/* <div className="col-lg-6 col-md-12 col-sm-12 image-column">
<div className="image_block_three">
<div className="image-box">
<figure className="image image-1"><img src="/assets/images/caregivers/right.webp" alt="A professional and friendly care provider" /></figure>
<figure className="image image-2"><img src="/assets/images/caregivers/left.webp" alt="A professional and friendly care provider" /></figure>
<div className="icon-box"><img src="/assets/images/caregivers/rapharehab-web-images.webp" alt="A professional and friendly care provider" /></div>
</div>
</div>
</div> */}
<div className="col-lg-4 col-md-12 col-sm-12 image-column mb-5 text-center text-lg-start">
<div className="image_block_four">
<div className="image-box">
<figure>
<img
src="/assets/images/caregivers/left.webp"
alt="Physiotherapy at Rapharehab"
className="img-fluid"
/>
</figure>
</div>
</div>
</div>
<div className="col-lg-8 col-md-12 col-sm-12 content-column mt-5">
<div className="content_block_one">
<div className="content-box">
<div className="sec-title-1 mb_15 mt_15">
<span className="sub-title-1">At RaphaRehab</span>
<h2>Professional, Friendly Care You Can Trust</h2>
</div>
<div className="text-box mb_40">
<p className="text-white">We choose caregivers who bring skill, compassion, and genuine dedication to those who need daily support.</p>
</div>
<div className="btn-box">
<Link href="/contact" className="theme-btn btn-one-new" aria-label="Contact"><span>Become a Caregiver</span></Link>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section className="team-section pb_90 bg-color-1">
<div className="auto-container">
{/* <div className="sec-title mb_50">
<span className="sub-title">Meet the Team</span>
<h2>Meet Our Experienced Therapists <br />for Exceptional Care</h2>
</div> */}
<div className="row clearfix justify-content-center">
{teamMembers.map((member, index) => (
<div key={member.id} className="col-lg-4 col-md-6 col-sm-12 team-block">
<div
className="team-block-two wow fadeInUp animated"
data-wow-delay={`${index * 200}ms`}
data-wow-duration="1500ms"
>
<div className="inner-box">
<div className="image-box">
<figure className="image">
<img
src={member.image}
alt={member.name}
style={{ width: "410px", height: "444px", objectFit: "cover" }}
/>
</figure>
</div>
<div className="lower-content">
<h3>
<Link href={`/our-team-physiotherapy-etobicoke/${member.slug}`} aria-label="Our team physiotherapy etobicoke">{member.name}</Link>
</h3>
<span className="designation">{member.designation}</span>
{/* <ul className="social-links clearfix">
{member.socials.map((social, idx) => (
<li key={idx}>
<Link href={social.link}><i className={social.icon}></i></Link>
</li>
))}
</ul> */}
</div>
</div>
</div>
</div>
))}
</div>
</div>
</section>
<section className="faq-section pt_90 pb_90">
<div className="auto-container">
<div className="sec-title centred mb_50">
<span className="sub-title">RaphaRehab</span>
<h2>Have Questions? Were <br />Here to Help.</h2>
</div>
<div className="row align-items-center clearfix">
{/* Left Side Image */}
<div className="col-lg-6 col-md-12 col-sm-12 image-column mb-5 text-center text-lg-start">
<div className="image_block_four">
<div className="image-box">
<figure>
<img
src="/assets/images/caregivers/nanocare.webp"
alt="Physiotherapy at Rapharehab"
className="img-fluid"
/>
</figure>
</div>
</div>
</div>
{/* Right Side FAQ Content */}
<div className="col-lg-6 col-md-12 col-sm-12 content-column">
<div className="content-box">
<ul className="accordion-box">
{/* FAQ 1 */}
<li className="accordion block">
<div
className={isActive.key === 1 ? "acc-btn active" : "acc-btn"}
onClick={() => handleToggle(1)}
>
<div className="icon-box"><i className="icon-34"></i></div>
<h3>Why should I apply to RaphaRehab?</h3>
</div>
<div className={isActive.key === 1 ? "acc-content current" : "acc-content"}>
<div className="content">
<div className="text">
<p>RaphaRehab offers a supportive work environment, flexible schedules, and opportunities to make a meaningful difference in peoples lives. We value compassion, professionalism, and growth and we ensure every caregiver feels respected, trained, and appreciated.</p>
</div>
</div>
</div>
</li>
{/* FAQ 2 */}
<li className="accordion block">
<div
className={isActive.key === 2 ? "acc-btn active" : "acc-btn"}
onClick={() => handleToggle(2)}
>
<div className="icon-box"><i className="icon-34"></i></div>
<h3>Where can I work?</h3>
</div>
<div className={isActive.key === 2 ? "acc-content current" : "acc-content"}>
<div className="content">
<div className="text">
<p>Our caregivers work across multiple home-care locations, supporting clients who need daily assistance, rehabilitation help, or companionship. Youll be matched with assignments based on your skills, comfort, and proximity.</p>
</div>
</div>
</div>
</li>
{/* FAQ 3 */}
<li className="accordion block">
<div
className={isActive.key === 3 ? "acc-btn active" : "acc-btn"}
onClick={() => handleToggle(3)}
>
<div className="icon-box"><i className="icon-34"></i></div>
<h3>What types of shifts do you offer?</h3>
</div>
<div className={isActive.key === 3 ? "acc-content current" : "acc-content"}>
<div className="content">
<div className="text">
<p>We provide a wide range of shift options, including hourly, part-time, full-time, overnight, and 24/7 live-in care. You can choose shifts that suit your schedule and lifestyle.</p>
</div>
</div>
</div>
</li>
{/* FAQ 4 */}
<li className="accordion block">
<div
className={isActive.key === 4 ? "acc-btn active" : "acc-btn"}
onClick={() => handleToggle(4)}
>
<div className="icon-box"><i className="icon-34"></i></div>
<h3>Do you hire full-time, part-time, or contract caregivers?</h3>
</div>
<div className={isActive.key === 4 ? "acc-content current" : "acc-content"}>
<div className="content">
<div className="text">
<p>Yes - we offer all options. Depending on your preference, you can join us as a full-time employee, part-time caregiver, or contracted professional. Our goal is to provide flexibility while maintaining high standards of care.</p>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</section>
</Layout>
</>
);
}