bender/91be151c-4d58-42f8-83bc-7072816ca57d
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/pages/HomePage/sections/Hero.tsx

Browse Source
This commit is contained in:
bender
2026-07-01 18:23:29 +00:00
parent 21393f6894
commit 712acc2005
1 changed files with 34 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
src/pages/HomePage/sections/Hero.tsx
View File

@@ -7,32 +7,32 @@ import ImageOrVideo from "@/components/ui/ImageOrVideo";
const primaryButton = {
text: "Take the Free Nervous System Quiz",
href: ""
href: "#"
};
const secondaryButton = {
text: "Book a consultation",
href: ""
text: "Learn More",
href: "/about"
};
const leftItems = [
{
imageSrc: "http://img.b2bpic.net/free-photo/attractive-smiling-doctor-holding-hand-heart-dreamily-looking-camera-isolated-tender-touched-expression_574295-2653.jpg?_wi=4"
imageSrc: "http://img.b2bpic.net/free-photo/attractive-smiling-doctor-holding-hand-heart-dreamily-looking-camera-isolated-tender-touched-expression_574295-2653.jpg"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/braille-alpahbet-pills-container-top-view_23-2148718145.jpg"
imageSrc: "http://img.b2bpic.net/free-photo/braille-alpahbet-pills-container-top-view_23-2148718145.jpg?_wi=2"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-male-doctor-wearing-medical-coat-stethoscope-around-his-neck-looking-side-isolated-blue-background_141793-133933.jpg"
imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-male-doctor-wearing-medical-coat-stethoscope-around-his-neck-looking-side-isolated-blue-background_141793-133933.jpg?_wi=2"
}
];
const rightItems = [
{
imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-pills-container_23-2148718176.jpg"
imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-pills-container_23-2148718176.jpg?_wi=2"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-pills-containers-stethoscope_23-2148718178.jpg"
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-pills-containers-stethoscope_23-2148718178.jpg?_wi=2"
},
{
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-joyful-male-doctor_171337-1489.jpg"
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-joyful-male-doctor_171337-1489.jpg?_wi=2"
}
];
@@ -57,26 +57,20 @@ const HeroInline = () => {
<div className="flex flex-col md:flex-row items-center gap-12 md:gap-20 w-content-width mx-auto">
<div className="w-full md:w-1/2">
<div className="flex flex-col items-center md:items-start gap-3">
<div className="px-3 py-1 mb-1 text-sm card rounded w-fit">
<p>{""}</p>
</div>
<TextAnimation
text={"There's no universal way to regulate a nervous system. There's yours."}
variant={"slide-up"}
gradientText={true}
tag="h1"
className="text-7xl 2xl:text-8xl leading-[1.15] font-semibold text-center md:text-left text-balance"
/>
<TextAnimation
text={"Most nervous system advice is built for a system that isn't yours. Take the 2-minute quiz to find out exactly which way your nervous system is stuck, and the protocol built for that, not someone else's."}
text={"Stop guessing your nervous system state. Get a personalized, clinician-built protocol in 2 minutes."}
variant={"slide-up"}
gradientText={false}
tag="p"
className="md:max-w-8/10 text-lg md:text-xl leading-snug text-center md:text-left text-balance"
tag="h1"
className="text-5xl md:text-6xl lg:text-7xl leading-[1.15] font-semibold text-center md:text-left text-balance text-foreground"
/>
<p className="md:max-w-8/10 text-lg md:text-xl leading-relaxed text-center md:text-left text-balance text-accent">
There&apos;s no universal way to regulate a nervous system. <span className="text-primary-cta font-medium">There&apos;s yours.</span> Most nervous system advice is built for a system that isn&apos;t yours. If you&apos;ve tried everything and are still stuck, <span className="text-primary-cta font-medium">you were given the wrong protocol.</span> Take the 2-minute quiz built by a practicing clinician — find out exactly which way your nervous system is stuck, and the protocol built for that, not someone else&apos;s.
</p>
<div className="flex flex-wrap max-md:justify-center gap-3 mt-2 md:mt-3">
<Button text={primaryButton.text} href={primaryButton.href} variant="primary"/>
<Button text={secondaryButton.text} href={secondaryButton.href} variant="secondary"animationDelay={0.1} />
@@ -84,8 +78,23 @@ const HeroInline = () => {
</div>
</div>
<div className="w-full md:w-1/2 flex justify-center overflow-hidden">
<ImageOrVideo imageSrc="https://storage.googleapis.com/webild/users/user_3FsC0wB8czDFk8S4DfiXOATKTCs/uploaded-1782930080750-mw3a1a5q.jpg" className="w-full h-auto max-h-[75vh] object-cover rounded-lg" />
<div className="w-full md:w-1/2 flex justify-center">
<div className="w-full max-w-md aspect-[4/5] rounded-lg overflow-hidden card p-2">
<ImageOrVideo
imageSrc="https://storage.googleapis.com/webild/users/user_3FsC0wB8czDFk8S4DfiXOATKTCs/uploaded-1782928869659-ksina2wv.png"
className="w-full h-full object-cover rounded"
/>
</div>
</div>
</div>
<div className="w-content-width mx-auto mt-24 pt-12 border-t border-white/10">
<p className="text-center text-sm text-accent mb-8 uppercase tracking-widest">Trusted by & Featured In</p>
<div className="flex flex-wrap justify-center items-center gap-8 md:gap-16 opacity-70 grayscale">
<div className="text-xl font-bold font-serif text-foreground">The Specific</div>
<div className="text-xl font-bold font-serif text-foreground">Upper Cervical Care</div>
<div className="text-xl font-bold font-serif text-foreground">Functional Neurology</div>
<div className="text-xl font-bold font-serif text-foreground">HRV Science</div>
</div>
</div>
</section>