Seed: nonprofit template (15 files)
This commit is contained in:
@@ -23,17 +23,17 @@ 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-7 w-7 transition-colors fill-current \${scrolled ? "text-emerald-600" : "text-white"}`} />
|
<Heart className={`h-7 w-7 transition-colors fill-current ${scrolled ? "text-emerald-600" : "text-white"}`} />
|
||||||
</div>
|
</div>
|
||||||
<span className={`text-lg font-bold tracking-tight transition-colors \${scrolled ? "text-slate-900 dark:text-white" : "text-white"}`}>Green Horizons Foundation</span>
|
<span className={`text-lg font-bold tracking-tight transition-colors ${scrolled ? "text-slate-900 dark:text-white" : "text-white"}`}>Green Horizons Foundation</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-emerald-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-emerald-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">
|
||||||
@@ -44,7 +44,7 @@ export default function Header() {
|
|||||||
</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">
|
||||||
|
|||||||
Reference in New Issue
Block a user