Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added public/assets/icons/view.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/assets/images/CVHerst.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/assets/images/PaulHarris.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/assets/images/ReidRubsamen.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified public/assets/images/deRisk.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/assets/images/deRisk1.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/assets/images/flowVax1.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified public/assets/images/patentProtection1.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified public/assets/images/patentProtection2.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/assets/images/team18.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
18 changes: 15 additions & 3 deletions src/app/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { SolutionPageContent } from './components/SolutionPageContent';
import { OurTeamPageContent } from './components/OurTeamPageContent';
import { ContactPageContent } from './components/ContactPageContent';
import { IMAGES } from '../constants/images';
import { MeetTeam } from './components/MeetTeam';

export default function App() {
const [isSafeOpen, setIsSafeOpen] = useState(false);
Expand Down Expand Up @@ -316,9 +317,7 @@ export default function App() {
<h2 className="text-[1.75rem] sm:text-3xl md:text-[2.5rem] font-medium text-gray-900 mb-5 leading-tight tracking-tight">
A next generation biotech company with <br className="hidden md:block" /> deep innovation history.
</h2>
<p className="text-gray-600 text-sm sm:text-base md:text-lg font-light tracking-wide">
At the summit of Science Poised to enter the Clinic.
</p>

</motion.section>

{/* 100px White Space Spacer */}
Expand Down Expand Up @@ -375,6 +374,19 @@ export default function App() {

{/* 100px White Space Spacer */}
<div className="w-full h-[100px] bg-white" aria-hidden="true" />

{/*Meet our team Section */}
<motion.div
initial={{ opacity: 0, y: 60 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true, margin: "-150px" }}
transition={{ duration: 0.8, ease: "easeOut", delay: 0.1 }}
>
<MeetTeam />
</motion.div>

{/* 100px White Space Spacer */}
<div className="w-full h-[100px] bg-white" aria-hidden="true" />
</main>

{/* Footer */}
Expand Down
8 changes: 4 additions & 4 deletions src/app/components/DeRiskedPath.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ export function DeRiskedPath() {
{/* Row 1 */}
<div className="flex flex-col sm:flex-row gap-4 sm:gap-6 w-full">
{/* The Funding Challenge */}
<div className="bg-[#0c0a00] p-5 md:p-6 rounded-2xl flex flex-col w-full sm:w-[42%] shrink-0 border border-white/5">
{/* <div className="bg-[#0c0a00] p-5 md:p-6 rounded-2xl flex flex-col w-full sm:w-[42%] shrink-0 border border-white/5">
<h3 className="text-white text-xl md:text-2xl font-medium tracking-tight">The Funding Challenge</h3>
<Divider />
<div className="w-full h-[140px] sm:h-[160px] md:h-[173px] mb-5 rounded-xl overflow-hidden relative">
Expand All @@ -112,10 +112,10 @@ export function DeRiskedPath() {
Breakthrough cancer research is traditionally capital-intensive, often leading to significant equity dilution for early investors.
</p>
</div>
</div>
</div> */}

{/* Market Opportunity & Exit */}
<div className="bg-[#0c0a00] p-5 md:p-6 rounded-2xl flex flex-col w-full sm:w-[58%] border border-white/5">
<div className="bg-[#0c0a00] p-5 md:p-6 rounded-2xl flex flex-col w-full border border-white/5">
<h3 className="text-white text-xl md:text-2xl font-medium tracking-tight">Market Opportunity & Exit</h3>
<Divider />
<div className="flex flex-col sm:flex-row gap-8 sm:gap-6 mt-2">
Expand Down Expand Up @@ -166,7 +166,7 @@ export function DeRiskedPath() {
<div className="flex flex-col mt-2">
<h4 className="text-white text-[15px] md:text-[16px] font-semibold tracking-tight mb-1.5">Reinvest Capital into Oncology</h4>
<p className="text-[#eee] text-[15px] md:text-base font-extralight leading-relaxed">
Programs: Direct the funding generated in Step 1 to advanced Glioblastoma (GBM) and other cancer vaccines into Phase 1/2 clinical trials.
Programs: Direct the funding generated in Step 1 to advance Glioblastoma (GBM) and other cancer vaccines into Phase 1/2 clinical trials.
</p>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion src/app/components/FlowVaxProvenScience.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ export function FlowVaxProvenScience() {
Full SARS-CoV-2 Protection
</h3>
<p className="text-[#aaa] text-lg font-light leading-relaxed">
Vaccination resulted in full protection against severe infection and virus-associated pneumonia in Rhesus Macaques
Vaccination resulted in full protection against virus-associated pneumonia in Rhesus Macaques.
</p>
</div>
</div>
Expand Down
7 changes: 3 additions & 4 deletions src/app/components/Footer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ export function Footer({
{/* Brand Column */}
<div className="w-full md:w-[45%] lg:w-[28%] flex flex-col gap-6">
<div className="flex items-center select-none">
<img src={IMAGES.homepage.logo} alt="Flo Pharma Logo" className="h-8 w-auto object-contain" />
<img src={IMAGES.homepage.logoWhite} alt="Flo Pharma Logo" className="h-8 w-auto object-contain" />
</div>
<p className="text-[#a1a1aa] text-[15px] leading-relaxed max-w-sm font-light">
A next-generation biotech company pioneering patented viral and oncology immunotherapies with a clear, de-risked path to commercialization.
Expand Down Expand Up @@ -81,9 +81,8 @@ export function Footer({
<div className="flex items-start gap-3 text-[#a1a1aa]">
<MapPin className="w-5 h-5 text-zinc-400 shrink-0 mt-0.5" />
<span className="text-[15px] font-light leading-relaxed">
Sydney Innovation Hub<br />
Level 4, 11 Biotech Way<br />
Sydney, NSW 2000, Australia
924 East 7th St #200<br />
Austin TX 78702
</span>
</div>
<div className="flex items-center gap-3 text-[#a1a1aa]">
Expand Down
169 changes: 169 additions & 0 deletions src/app/components/MeetTeam.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,169 @@
import { useEffect, useState } from "react";
import { IMAGES } from "../../constants/images";
import svgPaths from "../../imports/svg-6oa7gxdabo";
import { OurTeamPageContent } from "./OurTeamPageContent";
import { AnimatePresence, motion } from 'motion/react';
import { TeamMemberDetail } from "./TeamMemberDetail";


const data = {
members: [
{
name: "Reid Rubsamen",
role: "MD. Chairman of the Board",
image: IMAGES.ourTeams.ReidRubsamen,
description: "Dr. Reid Rubsamen is the visionary founder and CEO of Flow Pharma. A board-certified anesthesiologist with training at Massachusetts General Hospital (where he served as Chief Resident) and advanced degrees in both computer science and medicine from UC Berkeley and Stanford, Reid bridges the worlds of technology and healthcare. He previously founded two medical technology companies (including Aradigm Corporation) before launching Flow Pharma. An inventor at heart, he holds over 70 U.S. patents and has more than 10,000 citations to his scientific work – clear evidence of his innovative impact. Despite these accomplishments, Reid is known for his down-to-earth leadership and enthusiasm for mentoring others. He brings to the board not only profound expertise but also a genuine passion for collaboration and breakthrough innovation that inspires everyone around him."
},
{
name: "Paul Harris",
role: "Ph.D. Chief Science Officer",
image: IMAGES.ourTeams.PaulHarris,
description: "Paul Harris received his undergraduate degree from the University of California, Berkeley in Biochemistry and Medical Biophysics, his PhD in Cell Biology from Cornell University, and did Postdoctoral training in peptide chemistry at The Rockefeller University. He was a faculty member at the health sciences campus of Columbia University since 1988, most recently as an Associate Professor in Medical Science (in Medicine) in the medical school. Dr Harris' research efforts spanning 1990 to 2010 were instrumental in defining the structure of MHC bound peptides and dendritic cell therapy. Studies he co-authored provided the foundations for current vaccine design strategies."
},
{
name: "CV Herst",
role: "Ph.D. Senior Scientist",
image: IMAGES.ourTeams.CVHerst,
description: "C.V. Herst received his undergraduate degree in Bacteriology and his master's degree in Public Health from U.C. Berkeley, after which he was hired by Cetus Corporation, one of the original biotechnology companies, where he was on the cloning teams for IFN-beta, IL-2, and TNF-alpha. In 1989 he earned his Ph.D. in Tumor Cell Biology from Northwestern University. In his post-doctoral fellowship at MD Anderson Cancer Center, he researched bcr-abl breakpoint variations in chronic myelogenous leukemia. His career research efforts have led to approved therapies for systemic fungal infections, Multiple Sclerosis, certain cancers, as well as FDA approvals for medical devices. He has been a member of the Flow Pharma team since 2004."
},
]
}
interface TeamMember {
name: string;
role: string;
image: string;
description?: string;
}

export function MeetTeam() {
const [isTeamOpen, setIsTeamOpen] = useState(false);
const [isScrolled, setIsScrolled] = useState(false);
const [selectedMember, setSelectedMember] = useState<TeamMember | null>(null);

useEffect(() => {
const handleScroll = () => {
setIsScrolled(window.scrollY > 50);
};

window.addEventListener('scroll', handleScroll);
return () => window.removeEventListener('scroll', handleScroll);
}, []);

useEffect(() => {
if (isTeamOpen) {
setIsScrolled(false);
}
}, [isTeamOpen]);

return (
<section id="derisked-path" className="px-4 md:px-6 lg:px-12 py-10 w-full flex flex-col gap-12 lg:gap-16">

<div className="w-full xl:flex xl:items-end xl:justify-between grid">
<h1 className=" text-[40px] font-medium text-gray-900 w-full leading-[48px] tracking-tight">
Meet our Team<br />
Driven by Purpose, Powered by People
</h1>
<p className="text-lg text-gray-600 font-light leading-relaxed max-w-4xl">
Meet the scientists, innovators, and visionaries engineering a world without borders to immunity.
</p>
</div>

<div className="mb-16 w-full">
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-x-6 gap-y-12">
{data.members.map((member, idx) => (
<div
key={idx}
className="flex flex-col group cursor-pointer"
onClick={() => setSelectedMember(member)}
>
<div className="aspect-[533/426] rounded-[12px] overflow-hidden mb-6 bg-gray-100 relative">
<img src={member.image} alt={member.name} className="w-full h-full object-cover transition-transform duration-500 group-hover:scale-[1.03]" />

{/* Plus Icon */}
<div className="absolute right-4 bottom-4 w-12 h-12 md:w-16 md:h-16 opacity-90 group-hover:opacity-100 transition-opacity">
<div className="absolute inset-[8.33%]">
<svg className="absolute block w-full h-full drop-shadow-md" fill="none" preserveAspectRatio="none" viewBox="0 0 53.3333 53.3333">
<path d={svgPaths.p15971600} fill="white" className="group-hover:fill-[#1F4D71] transition-colors" />
</svg>
</div>
<div className="absolute inset-[39.58%]">
<div className="absolute inset-[-7.5%]">
<svg className="block w-full h-full" fill="none" preserveAspectRatio="none" viewBox="0 0 15.3333 15.3333">
<path d={svgPaths.pd1b9400} stroke="#1F4D71" className="group-hover:stroke-white transition-colors" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" />
</svg>
</div>
</div>
</div>
</div>

<div className="flex flex-col gap-2">
<h3 className="text-[20px] md:text-[24px] font-normal tracking-[-0.48px] text-[#0a0a0a] leading-tight">{member.name}</h3>
<p className="text-[15px] md:text-[16px] text-[#212121] font-light leading-snug">{member.role}</p>
</div>

</div>
))}

</div>
<div className="flex justify-center mt-10">
<button
onClick={() => {
setIsTeamOpen(true);
}}
className={`flex justify-between items-center cursor-pointer gap-4 border-2 border-[#0A253A] rounded-xl px-12 py-3 font-normal text-xl ${isScrolled ? 'hover:text-white hover:opacity-80' : 'hover:text-gray-500 hover:opacity-80'
} `}>

<p className="text-[#0A253A]">
View All
</p>
<img src={IMAGES.homepage.viewAllIcon} alt="blank" className="h-3.5" />
</button>
</div>

</div>
{/* Slide-up Team Page Modal */}
<AnimatePresence>
{isTeamOpen && (
<div key="team-modal" className="fixed inset-0 z-40 flex flex-col pointer-events-none pt-[72px]">
{/* Backdrop */}
<motion.div
key="team-backdrop"
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}
className="absolute inset-0 bg-white pointer-events-auto"
/>

{/* Sliding Panel */}
<motion.div
key="team-panel"
initial={{ y: 50, opacity: 0 }}
animate={{ y: 0, opacity: 1 }}
exit={{ y: 50, opacity: 0 }}
transition={{ type: "spring", damping: 25, stiffness: 200 }}
className="relative w-full h-full overflow-hidden bg-white pointer-events-auto flex flex-col z-10"
>
<div
className="flex-1 overflow-y-auto w-full h-full relative pb-12"
onScroll={(e) => {
const scrollTop = e.currentTarget.scrollTop;
setIsScrolled(scrollTop > 50);
}}
>
<OurTeamPageContent onClose={() => setIsTeamOpen(false)} />
</div>
</motion.div>
</div>
)}
</AnimatePresence>

{selectedMember && (
<TeamMemberDetail
member={selectedMember}
onClose={() => setSelectedMember(null)}
/>
)}
</section >

)
}
6 changes: 6 additions & 0 deletions src/app/components/OurTeamPageContent.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,12 @@ const teamData = {
image: IMAGES.ourTeams.team7,
description: "Borys Chabursky is a strategist extraordinaire in the life sciences arena, bringing decades of experience in guiding healthcare innovation. He is the founder and chairman of Shift Health, where he has led over 500 health science initiatives for more than 300 clients worldwide. Through this work, Borys has helped organizations craft business plans and partnerships that leveraged over $1 billion in funding for biomedical research and innovation. He has a proven talent for building bridges across sectors – facilitating dozens of public–private partnerships in biotech and global health, and advising stakeholders from pharmaceutical companies and hospital networks to government policymakers. Borys has also personally mentored startups (even stepping in as interim CEO for several) and seeded new ventures with angel funding. Colleagues know him as a big-picture thinker with a collaborative spirit; he excels at bringing together diverse experts to solve complex challenges. Despite his far-reaching network and achievements, Borys remains deeply committed to the human side of healthcare – he's driven by a passion to improve global health and ensure innovations reach those who need them. We are fortunate to have his wise, steady guidance and his knack for inspiring teamwork on our board."
},
{
name: "John Brady",
role: "B.Sc.",
image: IMAGES.ourTeams.team18,
description: ""
}
],
management: [
{
Expand Down
4 changes: 2 additions & 2 deletions src/app/components/PatentProtection.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ export function PatentProtection() {
Securing the Future of FlowVax
</h2>
<p className="text-[#212121] text-lg font-light leading-relaxed lg:max-w-2xl">
Securing exclusive rights and ensuring global growth for Flow Pharma's innovative cancer vaccine platform
Securing exclusive rights and ensuring global growth for Flow Pharma&apos;s innovative vaccine platform
</p>
</div>

Expand Down Expand Up @@ -76,7 +76,7 @@ export function PatentProtection() {

<div className="flex flex-col gap-6">
<div className="flex flex-col gap-1 pb-6 border-b border-black/20">
<h4 className="text-2xl text-[#0a0a0a] font-normal tracking-[-0.48px]">Global Jurisdictional Reach</h4>
<h4 className="text-2xl text-[#0a0a0a] font-normal tracking-[-0.48px]">Global Reach</h4>
<p className="text-[#212121] text-lg font-light leading-relaxed">
Robust protection established across multiple international territories.
</p>
Expand Down
14 changes: 7 additions & 7 deletions src/app/components/TeamMemberDetail.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export function TeamMemberDetail({ member, onClose }: TeamMemberDetailProps) {
className="absolute inset-0 bg-black/60 backdrop-blur-sm"
onClick={onClose}
/>

{/* Modal Content */}
<motion.div
initial={{ y: 50, opacity: 0, scale: 0.95 }}
Expand All @@ -50,12 +50,12 @@ export function TeamMemberDetail({ member, onClose }: TeamMemberDetailProps) {
<div className="overflow-y-auto max-h-[90vh]">
<div className="flex flex-col md:flex-row">
{/* Image Section */}
<div className="md:w-2/5 bg-gray-100 flex-shrink-0">
<div className="w-full h-[400px] md:h-[600px] relative">
<img
src={member.image}
alt={member.name}
className="w-full h-full object-cover object-center"
<div className="md:w-2/5 bg-gray-100 flex-shrink-0 relative">
<div className="w-full h-[400px] md:h-[600px] ">
<img
src={member.image}
alt={member.name}
className="absolute w-full h-full object-contain block inset-0 "
/>
</div>
</div>
Expand Down
Loading