150 lines
8.5 KiB
JavaScript
150 lines
8.5 KiB
JavaScript
'use client'
|
||
import CounterUp from "@/components/elements/CounterUp"
|
||
import Layout from "@/components/layout/Layout"
|
||
import Link from "next/link"
|
||
import { useState } from 'react'
|
||
import ModalVideo from 'react-modal-video'
|
||
import { motion } from "framer-motion"
|
||
|
||
const ProgressBar = ({ label, percent }) => (
|
||
<div className="progress-box">
|
||
<p>{label}</p>
|
||
<div className="bar">
|
||
<div className="bar-inner count-bar" style={{ width: `${percent}%` }}></div>
|
||
<div className="count-text">{`${percent}%`}</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
|
||
export default function Home() {
|
||
const [isOpen, setOpen] = useState(false)
|
||
const [isActive, setIsActive] = useState({
|
||
status: false,
|
||
key: 1,
|
||
})
|
||
|
||
const handleToggle = (key) => {
|
||
if (isActive.key === key) {
|
||
setIsActive({
|
||
status: false,
|
||
})
|
||
} else {
|
||
setIsActive({
|
||
status: true,
|
||
key,
|
||
})
|
||
}
|
||
}
|
||
|
||
return (
|
||
<>
|
||
<section className="chooseus-style-two pt_90 pb_90">
|
||
<div className="auto-container">
|
||
<div className="row clearfix">
|
||
<div className="content-box">
|
||
{/* Top Intro */}
|
||
<div className="sec-title mb_50 text-center">
|
||
<h2 className="mb-3">COVID 19 UPDATES</h2>
|
||
<p className="section-para">
|
||
The COVID 19 pandemic has created increased stress and anxiety levels for many people.
|
||
We would like to take this opportunity to remind you that virtual therapy and at-home
|
||
or mobile therapy are effective alternatives to in-clinic therapy for many of our clients.
|
||
</p>
|
||
</div>
|
||
|
||
{/* Virtual Therapy (Right aligned on desktop, center on mobile) */}
|
||
<div className="row clearfix">
|
||
<div className="col-lg-12 col-md-12 col-sm-12 chooseus-block">
|
||
<motion.div
|
||
className="chooseus-block-one d-flex justify-content-center justify-content-lg-end text-lg-left"
|
||
initial={{ opacity: 0, x: 100 }}
|
||
whileInView={{ opacity: 1, x: 0 }}
|
||
transition={{ duration: 0.8, ease: "easeOut" }}
|
||
viewport={{ once: true }}
|
||
>
|
||
<div className="inner-box w-100 pb-0">
|
||
<div className="icon-box mb-3 mb-lg-0">
|
||
<img src="/assets/images/covid/virtual.webp" alt="Virtual Therapy" loading="lazy" />
|
||
</div>
|
||
<h3>VIRTUAL THERAPY</h3>
|
||
<p>
|
||
As an alternative to receiving direct in-clinic therapy, we continue to offer all
|
||
clients the option to receive tele-rehabilitation or virtual therapy services to
|
||
address your current therapy needs.
|
||
</p>
|
||
</div>
|
||
</motion.div>
|
||
</div>
|
||
|
||
{/* Home Therapy (Left aligned on desktop, center on mobile) */}
|
||
<div className="col-lg-12 col-md-12 col-sm-12 chooseus-block mt-4">
|
||
<motion.div
|
||
className="chooseus-block-one d-flex justify-content-center justify-content-lg-start text-lg-left"
|
||
initial={{ opacity: 0, x: -100 }}
|
||
whileInView={{ opacity: 1, x: 0 }}
|
||
transition={{ duration: 0.8, ease: "easeOut" }}
|
||
viewport={{ once: true }}
|
||
>
|
||
<div className="inner-box d-flex flex-column flex-lg-row-reverse align-items-lg-start w-100 pb-0" >
|
||
|
||
<div className="icon-box ml-lg-3 mb-3 mb-lg-0">
|
||
<img src="/assets/images/covid/home.webp" alt="Home Therapy" loading="lazy"/>
|
||
</div>
|
||
|
||
<div>
|
||
<h3>HOME THERAPY</h3>
|
||
<p>
|
||
The convenience of having a physiotherapist come to your home eliminates barriers
|
||
faced by those who can’t drive. This improved access to therapy makes it easier for
|
||
clients to be an active participant in their recovery.
|
||
</p>
|
||
<p>
|
||
Being able to interact with clients in their home setting enables a therapist to see
|
||
how the client moves and completes tasks in their everyday life.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</motion.div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
{/* Subscribe Section */}
|
||
{/* <section className="subscribe-section pt-0 bg-color-1">
|
||
<div className="auto-container">
|
||
<div className="inner-container">
|
||
<div className="row align-items-center">
|
||
<div className="col-lg-6 col-md-12 col-sm-12 text-column">
|
||
<div className="text-box text-center text-lg-left">
|
||
<h2><span>Subscribe</span> for the exclusive updates!</h2>
|
||
</div>
|
||
</div>
|
||
<div className="col-lg-6 col-md-12 col-sm-12 form-column">
|
||
<div className="form-inner">
|
||
<form method="post" action="contact">
|
||
<div className="form-group">
|
||
<input type="email" name="email" placeholder="Enter Your Email Address" required />
|
||
<button type="submit" className="theme-btn btn-one"><span>Subscribe Now</span></button>
|
||
</div>
|
||
<div className="form-group">
|
||
<div className="check-box">
|
||
<input className="check" type="checkbox" id="checkbox1" />
|
||
<label htmlFor="checkbox1">
|
||
I agree to the <Link href="index">Privacy Policy.</Link>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section> */}
|
||
</>
|
||
)
|
||
}
|