shiitake-john-website/app/page.tsx

208 lines
9.8 KiB
TypeScript

import { Navigation } from "@/components/navigation"
import { Button } from "@/components/ui/button"
import { Card, CardContent } from "@/components/ui/card"
import Link from "next/link"
export default function Home() {
return (
<div className="min-h-screen bg-background">
<Navigation />
{/* Hero Section */}
<section className="relative py-20 px-4 forest-texture">
<div className="container mx-auto max-w-6xl">
<div className="grid md:grid-cols-2 gap-12 items-center">
<div>
<h1 className="text-5xl md:text-6xl font-bold text-foreground mb-6 text-balance">
Welcome to Shiitake John&#39;s Woodlot
</h1>
<p className="text-xl text-muted-foreground mb-8 leading-relaxed text-pretty">
At the edge of civilization on Texada Island, where the pavement ends and the forest begins, John
cultivates shiitake mushrooms the old waywith patience, care, and 20 acres of pristine woodland.
</p>
<div className="flex gap-4">
<Link href="/sponsor">
<Button size="lg" className="bg-[#1a4d2e] hover:bg-[#153d24] text-white">
Sponsor the Old Growth
</Button>
</Link>
<Link href="/events">
<Button
size="lg"
variant="outline"
className="border-primary text-primary hover:bg-primary/10 bg-transparent"
>
View Cultivation Courses
</Button>
</Link>
</div>
</div>
<div className="relative h-[400px] rounded-lg overflow-hidden">
<img
src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/IMG_20251102_122857_357-qnZHfuPlKuvI6Qb5G9QucUFgve1FZk.jpg"
alt="Turkey tail mushrooms growing on mossy log"
className="w-full h-full object-cover"
/>
</div>
</div>
</div>
</section>
{/* About Section */}
<section className="py-16 px-4 bg-muted/30 moss-texture">
<div className="container mx-auto max-w-6xl">
<h2 className="text-4xl font-bold text-foreground mb-12 text-center">Life at the Edge of the Woods</h2>
<div className="grid md:grid-cols-3 gap-8">
<Card className="border-border">
<CardContent className="pt-6">
<div className="text-4xl mb-4">🌲</div>
<h3 className="text-xl font-semibold mb-3 text-foreground">Log Cultivation</h3>
<p className="text-muted-foreground leading-relaxed">
Traditional shiitake cultivation using sustainable forest practices. Each mushroom is lovingly grown
on carefully selected logs.
</p>
</CardContent>
</Card>
<Card className="border-border">
<CardContent className="pt-6">
<div className="text-4xl mb-4">🎓</div>
<h3 className="text-xl font-semibold mb-3 text-foreground">Teaching & Courses</h3>
<p className="text-muted-foreground leading-relaxed">
Learn the art of mushroom cultivation from someone who lives and breathes it. Hands-on courses in the
heart of the forest.
</p>
</CardContent>
</Card>
<Card className="border-border">
<CardContent className="pt-6">
<div className="text-4xl mb-4">🤝</div>
<h3 className="text-xl font-semibold mb-3 text-foreground">Community Spirit</h3>
<p className="text-muted-foreground leading-relaxed">
A regular volunteer and storyteller, sharing tales of mining days, Texada flower rock, and red hot
beat poetry by the fire.
</p>
</CardContent>
</Card>
</div>
</div>
</section>
<section className="py-16 px-4 fern-pattern">
<div className="container mx-auto max-w-6xl">
<div className="grid md:grid-cols-2 gap-12 items-center">
<div>
<h2 className="text-4xl font-bold text-foreground mb-6">Protecting the Watershed</h2>
<p className="text-muted-foreground leading-relaxed mb-4">
Our forest is part of a critical watershed that supports one of the world's rarest fish species—the
Texada Island stickleback species pairs. These remarkable fish are found in only five small lakes on the
Sunshine Coast, making them globally significant.
</p>
<p className="text-muted-foreground leading-relaxed mb-4">
The stickleback species pairs are among the youngest species on Earth, having evolved in less than
13,000 years since the last Ice Age. They consist of two distinct forms—the "limnetics" that live in
open water eating plankton, and the "benthics" that dwell in the shallows feeding on invertebrates.
</p>
<p className="text-muted-foreground leading-relaxed mb-6">
By supporting sustainable forest practices here, you're helping protect the pristine watershed these
endangered fish depend on for survival. Our careful stewardship ensures clean water flows into nearby
lakes, preserving habitat for these unique evolutionary treasures.
</p>
<div className="flex flex-col sm:flex-row gap-4">
<Button
variant="outline"
className="border-primary text-primary hover:bg-primary/10 bg-transparent"
asChild
>
<a
href="https://bcinvasives.ca/news/texada-island-sticklebacks/"
target="_blank"
rel="noopener noreferrer"
>
Learn About the Stickleback
</a>
</Button>
<Button
variant="outline"
className="border-primary text-primary hover:bg-primary/10 bg-transparent"
asChild
>
<a
href="https://texada.org/texada-island-stickleback-society/"
target="_blank"
rel="noopener noreferrer"
>
Texada Stickleback Society
</a>
</Button>
</div>
</div>
<div className="relative h-[400px] rounded-lg overflow-hidden bg-muted/50 flex items-center justify-center">
<img
src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/IMG_20251102_122900_435-wb8VPiXxn7UUctygqQDrIINgVJkDZF.jpg"
alt="Moss and lichen in the forest watershed"
className="w-full h-full object-cover"
/>
</div>
</div>
</div>
</section>
{/* Story Section */}
<section className="py-16 px-4 moss-texture">
<div className="container mx-auto max-w-4xl">
<div className="grid md:grid-cols-2 gap-12 items-center">
<div className="relative h-[350px] rounded-lg overflow-hidden">
<img
src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/IMG_20251102_122849_429-trLTSHlz0FNvU5yO4XhGqSk8PakrO2.jpg"
alt="Una the dog in the mossy forest"
className="w-full h-full object-cover"
/>
</div>
<div>
<h2 className="text-3xl font-bold text-foreground mb-6">A Modern Day Tom Bombadil</h2>
<p className="text-muted-foreground leading-relaxed mb-4">
In his small log cabin deep in the woods, Shiitake John lives amongst the deer with his faithful
companion Una. The forest is his home, his classroom, and his sanctuary.
</p>
<p className="text-muted-foreground leading-relaxed mb-4">
Sit by the fire long enough, and you'll hear stories of mining adventures, the mysteries of Texada's
rare flower rock, or perhaps a spontaneous recitation of beat poetry that echoes through the trees.
</p>
<p className="text-muted-foreground leading-relaxed">
This is more than mushroom farmingit's a way of life at the edge of civilization, where nature and
knowledge intertwine.
</p>
</div>
</div>
</div>
</section>
{/* CTA Section */}
<section className="py-20 px-4 bg-primary text-primary-foreground">
<div className="container mx-auto max-w-4xl text-center">
<h2 className="text-4xl font-bold mb-6">Help Preserve the Old Growth</h2>
<p className="text-xl mb-8 text-primary-foreground/90 leading-relaxed text-pretty">
Your support helps maintain these 20 acres of old growth forest, protect the watershed for endangered
species, continue sustainable mushroom cultivation, and keep the courses and community programs thriving.
</p>
<Link href="/sponsor">
<Button size="lg" className="bg-[#1a4d2e] hover:bg-[#153d24] text-white">
Become a Sponsor
</Button>
</Link>
</div>
</section>
{/* Footer */}
<footer className="py-8 px-4 border-t border-border forest-texture">
<div className="container mx-auto max-w-6xl text-center text-muted-foreground">
<p>Shiitake John's Forest Texada Island, BC Where the pavement ends</p>
</div>
</footer>
</div>
)
}