feat: remove Contact link from header navigation
Update main nav to LinkTree, Shop, and Read the Book. #VERCEL_SKIP Co-authored-by: Jeff Emmett <46964190+Jeff-Emmett@users.noreply.github.com>
This commit is contained in:
v0
parent
1a82b00da5
commit
3bf1d7aa9f
|
|
@ -0,0 +1,122 @@
|
|||
import { Mail, LinkIcon } from "lucide-react"
|
||||
import { Button } from "@/components/ui/button"
|
||||
import Image from "next/image"
|
||||
import { Header } from "@/components/header"
|
||||
import { Footer } from "@/components/footer"
|
||||
|
||||
export default function ContactPage() {
|
||||
return (
|
||||
<div className="min-h-screen flex flex-col">
|
||||
<Header />
|
||||
|
||||
<main className="flex-1 bg-background">
|
||||
<div className="container mx-auto px-4 py-16 max-w-5xl">
|
||||
<div className="mb-16">
|
||||
<h1
|
||||
className="text-5xl md:text-6xl font-bold mb-6 text-foreground"
|
||||
style={{ fontFamily: "var(--font-crimson)" }}
|
||||
>
|
||||
Let's Anastomose
|
||||
</h1>
|
||||
<p className="text-xl text-foreground/70 max-w-3xl leading-relaxed">
|
||||
Just as mycelial networks form connections through anastomosis—fusing together to create stronger, more
|
||||
resilient networks—we'd love to connect and collaborate with you.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Animated Mycelium Image */}
|
||||
<div className="mb-16">
|
||||
<div className="relative w-full aspect-[16/9] overflow-hidden border border-border/50 shadow-sm">
|
||||
<Image
|
||||
src="/mycelium-hyphal-threads-connecting-and-anastomosin.jpg"
|
||||
alt="Mycelium hyphal threads connecting through anastomosis"
|
||||
fill
|
||||
className="object-cover"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space-y-12">
|
||||
{/* Contact Information */}
|
||||
<div className="border-l-4 border-primary pl-6 py-4">
|
||||
<h2 className="text-2xl font-bold mb-6 text-foreground" style={{ fontFamily: "var(--font-crimson)" }}>
|
||||
Contact Information
|
||||
</h2>
|
||||
<div className="grid md:grid-cols-2 gap-8">
|
||||
<div>
|
||||
<div className="flex items-center gap-3 mb-3">
|
||||
<Mail className="h-5 w-5 text-secondary" />
|
||||
<h3 className="text-lg font-semibold text-foreground">Email</h3>
|
||||
</div>
|
||||
<a
|
||||
href="mailto:connect@mycofi.earth"
|
||||
className="text-foreground/70 hover:text-primary transition-colors underline decoration-1 underline-offset-4"
|
||||
>
|
||||
connect@mycofi.earth
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<div className="flex items-center gap-3 mb-3">
|
||||
<LinkIcon className="h-5 w-5 text-secondary" />
|
||||
<h3 className="text-lg font-semibold text-foreground">ENS Address</h3>
|
||||
</div>
|
||||
<div className="font-mono text-foreground/70">mycofi.eth</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Social Links */}
|
||||
<div className="border-l-4 border-secondary pl-6 py-4">
|
||||
<h2 className="text-2xl font-bold mb-4 text-foreground" style={{ fontFamily: "var(--font-crimson)" }}>
|
||||
Social Channels
|
||||
</h2>
|
||||
<p className="text-foreground/70 mb-6">Connect with us across all platforms through our link hub.</p>
|
||||
<Button asChild variant="outline" size="lg" className="bg-transparent">
|
||||
<a href="https://links.mycofi.earth" target="_blank" rel="noopener noreferrer">
|
||||
View All Social Links →
|
||||
</a>
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{/* Engagements */}
|
||||
<div className="border-l-4 border-accent pl-6 py-4">
|
||||
<h2 className="text-2xl font-bold mb-4 text-foreground" style={{ fontFamily: "var(--font-crimson)" }}>
|
||||
Collaboration Opportunities
|
||||
</h2>
|
||||
<p className="text-foreground/70 mb-8 leading-relaxed">
|
||||
We welcome engagements for speaking opportunities, co-publishing initiatives, and consulting on
|
||||
regenerative economic design.
|
||||
</p>
|
||||
<div className="grid md:grid-cols-3 gap-6 mb-8">
|
||||
<div className="border-l-2 border-secondary/50 pl-4">
|
||||
<div className="text-lg font-semibold mb-2 text-foreground">Speaking</div>
|
||||
<p className="text-sm text-foreground/60">Conferences, workshops, and events</p>
|
||||
</div>
|
||||
<div className="border-l-2 border-secondary/50 pl-4">
|
||||
<div className="text-lg font-semibold mb-2 text-foreground">Co-Publishing</div>
|
||||
<p className="text-sm text-foreground/60">Research, articles, and content</p>
|
||||
</div>
|
||||
<div className="border-l-2 border-secondary/50 pl-4">
|
||||
<div className="text-lg font-semibold mb-2 text-foreground">Consulting</div>
|
||||
<p className="text-sm text-foreground/60">Regenerative economic design</p>
|
||||
</div>
|
||||
</div>
|
||||
<Button asChild size="lg" className="bg-emerald-700 hover:bg-emerald-600 text-white">
|
||||
<a href="mailto:connect@mycofi.earth?subject=Collaboration Inquiry">Get in Touch →</a>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Footer Note */}
|
||||
<div className="mt-16 pt-8 border-t border-border/50">
|
||||
<p className="text-foreground/60 leading-relaxed">
|
||||
Like mycelium, we grow stronger through connection. Let's build regenerative futures together.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<Footer />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
@ -53,21 +53,6 @@ export function Footer() {
|
|||
Shop
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3 className="font-semibold mb-3 text-black !opacity-100">Connect</h3>
|
||||
<ul className="space-y-2 text-sm">
|
||||
<li>
|
||||
<Link
|
||||
href="https://links.mycofi.earth"
|
||||
target="_blank"
|
||||
className="text-black !opacity-100 hover:text-primary transition-colors"
|
||||
>
|
||||
All Links
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link
|
||||
href="https://mycopunks.gitbook.io/mycopunk-principles"
|
||||
|
|
@ -79,6 +64,26 @@ export function Footer() {
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h3 className="font-semibold mb-3 text-black !opacity-100">Connect</h3>
|
||||
<ul className="space-y-2 text-sm">
|
||||
<li>
|
||||
<Link href="/contact" className="text-black !opacity-100 hover:text-primary transition-colors">
|
||||
Contact
|
||||
</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link
|
||||
href="https://links.mycofi.earth"
|
||||
target="_blank"
|
||||
className="text-black !opacity-100 hover:text-primary transition-colors"
|
||||
>
|
||||
All Links
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-12 pt-8 border-t border-border text-center text-sm text-black !opacity-100">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,26 @@
|
|||
<svg width="180" height="180" viewBox="0 0 180 180" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<style>
|
||||
@media (prefers-color-scheme: light) {
|
||||
.background { fill: black; }
|
||||
.foreground { fill: white; }
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.background { fill: white; }
|
||||
.foreground { fill: black; }
|
||||
}
|
||||
</style>
|
||||
<g clip-path="url(#clip0_7960_43945)">
|
||||
<rect class="background" width="180" height="180" rx="37" />
|
||||
<g style="transform: scale(95%); transform-origin: center">
|
||||
<path class="foreground"
|
||||
d="M101.141 53H136.632C151.023 53 162.689 64.6662 162.689 79.0573V112.904H148.112V79.0573C148.112 78.7105 148.098 78.3662 148.072 78.0251L112.581 112.898C112.701 112.902 112.821 112.904 112.941 112.904H148.112V126.672H112.941C98.5504 126.672 86.5638 114.891 86.5638 100.5V66.7434H101.141V100.5C101.141 101.15 101.191 101.792 101.289 102.422L137.56 66.7816C137.255 66.7563 136.945 66.7434 136.632 66.7434H101.141V53Z" />
|
||||
<path class="foreground"
|
||||
d="M65.2926 124.136L14 66.7372H34.6355L64.7495 100.436V66.7372H80.1365V118.47C80.1365 126.278 70.4953 129.958 65.2926 124.136Z" />
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_7960_43945">
|
||||
<rect width="180" height="180" fill="white" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 148 KiB |
Loading…
Reference in New Issue