vibeasite-templates/template-healthcare
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Seed: healthcare template (18 files)

Browse Source
This commit is contained in:
jyswee
2026-07-23 22:58:16 +00:00
parent 7a066587ba
commit abe6e401d2
1 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Header.tsx
+8 -8
View File
@@ -22,7 +22,7 @@ function PatientPortal({ trigger }: { trigger: React.ReactNode }) {
if (isSignedIn) { if (isSignedIn) {
return ( return (
<Button variant="ghost" size="sm" className="text-slate-600 dark:text-slate-300 hover:text-sky-500 font-medium" onClick={() => { signout(); toast.success("Signed out of patient portal"); }}> <Button variant="ghost" size="sm" className="text-slate-600 dark:text-slate-300 hover:text-sky-500 font-medium" onClick={() => { signout(); toast.success("Signed out of patient portal"); }}>
Sign Out{user?.email ? ` (\${user.email})` : ""} Sign Out{user?.email ? ` (${user.email})` : ""}
</Button> </Button>
); );
} }
@@ -96,30 +96,30 @@ export default function Header() {
]; ];
return ( return (
<header className={`fixed top-0 inset-x-0 z-50 transition-all duration-300 \${scrolled ? "bg-white/90 dark:bg-slate-950/95 backdrop-blur-lg border-b border-slate-200 dark:border-slate-800 shadow-sm" : "bg-transparent"}`}> <header className={`fixed top-0 inset-x-0 z-50 transition-all duration-300 ${scrolled ? "bg-white/90 dark:bg-slate-950/95 backdrop-blur-lg border-b border-slate-200 dark:border-slate-800 shadow-sm" : "bg-transparent"}`}>
<div className="mx-auto max-w-7xl flex items-center justify-between px-6 py-4"> <div className="mx-auto max-w-7xl flex items-center justify-between px-6 py-4">
<Link to="/" className="flex items-center gap-2 group"> <Link to="/" className="flex items-center gap-2 group">
<div className="relative"> <div className="relative">
<Heart className={`h-6 w-6 transition-colors \${scrolled ? "text-sky-500" : "text-white"}`} /> <Heart className={`h-6 w-6 transition-colors ${scrolled ? "text-sky-500" : "text-white"}`} />
<Activity className={`absolute -bottom-0.5 -right-1 h-3 w-3 transition-colors \${scrolled ? "text-teal-500" : "text-sky-200"}`} /> <Activity className={`absolute -bottom-0.5 -right-1 h-3 w-3 transition-colors ${scrolled ? "text-teal-500" : "text-sky-200"}`} />
</div> </div>
<span className={`text-lg font-bold tracking-tight transition-colors \${scrolled ? "text-slate-900 dark:text-white" : "text-white"}`}>Vitality Medical Center</span> <span className={`text-lg font-bold tracking-tight transition-colors ${scrolled ? "text-slate-900 dark:text-white" : "text-white"}`}>Vitality Medical Center</span>
</Link> </Link>
<nav className="hidden md:flex items-center gap-8"> <nav className="hidden md:flex items-center gap-8">
{links.map((l) => ( {links.map((l) => (
<Link key={l.to} to={l.to} className={`text-sm font-medium transition-colors hover:text-sky-500 \${scrolled ? "text-slate-600 dark:text-slate-300" : "text-white/90"}`}>{l.label}</Link> <Link key={l.to} to={l.to} className={`text-sm font-medium transition-colors hover:text-sky-500 ${scrolled ? "text-slate-600 dark:text-slate-300" : "text-white/90"}`}>{l.label}</Link>
))} ))}
</nav> </nav>
<div className="hidden md:flex items-center gap-3"> <div className="hidden md:flex items-center gap-3">
<ThemeToggle /> <ThemeToggle />
<PatientPortal trigger={<Button variant="ghost" size="sm" className={`rounded-full gap-1.5 \${scrolled ? "text-slate-600 dark:text-slate-300" : "text-white/90 hover:text-white hover:bg-white/10"}`}><User className="h-4 w-4" /> Portal</Button>} /> <PatientPortal trigger={<Button variant="ghost" size="sm" className={`rounded-full gap-1.5 ${scrolled ? "text-slate-600 dark:text-slate-300" : "text-white/90 hover:text-white hover:bg-white/10"}`}><User className="h-4 w-4" /> Portal</Button>} />
<Button asChild size="sm" className="bg-sky-500 hover:bg-sky-600 text-white rounded-full px-6 shadow-lg shadow-sky-500/20 active:scale-[0.97] transition-all"> <Button asChild size="sm" className="bg-sky-500 hover:bg-sky-600 text-white rounded-full px-6 shadow-lg shadow-sky-500/20 active:scale-[0.97] transition-all">
<Link to="/contact">Book Appointment</Link> <Link to="/contact">Book Appointment</Link>
</Button> </Button>
</div> </div>
<Sheet open={open} onOpenChange={setOpen}> <Sheet open={open} onOpenChange={setOpen}>
<SheetTrigger asChild className="md:hidden"> <SheetTrigger asChild className="md:hidden">
<Button variant="ghost" size="icon" className={`\${scrolled ? "text-slate-900 dark:text-white" : "text-white"}`}><Menu className="h-5 w-5" /></Button> <Button variant="ghost" size="icon" className={`${scrolled ? "text-slate-900 dark:text-white" : "text-white"}`}><Menu className="h-5 w-5" /></Button>
</SheetTrigger> </SheetTrigger>
<SheetContent side="right" className="w-72 bg-white dark:bg-slate-950 border-slate-200 dark:border-slate-800"> <SheetContent side="right" className="w-72 bg-white dark:bg-slate-950 border-slate-200 dark:border-slate-800">
<nav className="mt-8 flex flex-col gap-4"> <nav className="mt-8 flex flex-col gap-4">