382 lines
17 KiB
TypeScript
382 lines
17 KiB
TypeScript
import { Button } from "@/components/ui/button"
|
|
import { Card, CardContent } from "@/components/ui/card"
|
|
import { ArrowRight, Calendar, MapPin, Users, Heart, Sprout, Network } from "lucide-react"
|
|
import Link from "next/link"
|
|
|
|
export default function HomePage() {
|
|
return (
|
|
<div className="min-h-screen">
|
|
{/* Hero Section */}
|
|
<section className="relative min-h-[90vh] flex items-center justify-center overflow-hidden">
|
|
<div
|
|
className="absolute inset-0 bg-cover bg-center z-0"
|
|
style={{
|
|
backgroundImage: `url('/images/20220429-145359.jpg')`,
|
|
}}
|
|
/>
|
|
<div className="absolute inset-0 bg-gradient-to-b from-background/80 via-background/70 to-background z-[1]" />
|
|
|
|
<div className="container mx-auto px-4 relative z-10 text-center max-w-5xl">
|
|
<h1 className="text-5xl md:text-7xl lg:text-8xl font-bold mb-6 text-balance leading-[1.1]">
|
|
Crypto Commons
|
|
<br />
|
|
Gathering
|
|
</h1>
|
|
|
|
<div className="inline-block mb-6 px-4 py-1.5 bg-primary/10 border border-primary/20 rounded-full backdrop-blur-sm">
|
|
<p className="text-sm font-mono text-primary">August 16-22, 2026</p>
|
|
</div>
|
|
|
|
<p className="text-lg md:text-xl text-muted-foreground mb-8 max-w-2xl mx-auto text-pretty leading-relaxed">
|
|
A hack-ademic confluence of commons praxis and the latest cryptographic technologies, set in the foothills
|
|
of the Austrian Alps.
|
|
</p>
|
|
|
|
<div className="flex flex-col sm:flex-row gap-4 justify-center items-center mb-12">
|
|
<Button size="lg" className="gap-2 text-base" asChild>
|
|
<Link href="/register">
|
|
Register Now <ArrowRight className="w-4 h-4" />
|
|
</Link>
|
|
</Button>
|
|
<Button size="lg" variant="outline" className="gap-2 text-base bg-transparent backdrop-blur-sm" asChild>
|
|
<Link href="https://t.me/+8a7PooNV6202YjI0" target="_blank" rel="noopener noreferrer">
|
|
Join Telegram
|
|
</Link>
|
|
</Button>
|
|
</div>
|
|
|
|
<div className="flex flex-wrap gap-6 justify-center text-sm text-muted-foreground">
|
|
<div className="flex items-center gap-2">
|
|
<MapPin className="w-4 h-4 text-primary" />
|
|
<span>Reichenau an der Rax, Austria</span>
|
|
</div>
|
|
<div className="flex items-center gap-2">
|
|
<Calendar className="w-4 h-4 text-primary" />
|
|
<span>6 Days • Unconference</span>
|
|
</div>
|
|
<div className="flex items-center gap-2">
|
|
<Users className="w-4 h-4 text-primary" />
|
|
<span>Hackers, Academics, Activists, Researchers, Builders </span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Community Photos Section */}
|
|
<section className="py-16 px-4 bg-background">
|
|
<div className="container mx-auto max-w-6xl">
|
|
<div className="grid md:grid-cols-3 gap-4">
|
|
<div className="aspect-[4/3] rounded-lg overflow-hidden">
|
|
<img
|
|
src="/images/image.jpeg"
|
|
alt="CCG participants in discussion circle"
|
|
className="w-full h-full object-cover"
|
|
/>
|
|
</div>
|
|
<div className="aspect-[4/3] rounded-lg overflow-hidden">
|
|
<img src="/images/image.jpeg" alt="Community meal at CCG" className="w-full h-full object-cover" />
|
|
</div>
|
|
<div className="aspect-[4/3] rounded-lg overflow-hidden">
|
|
<img src="/images/image.png" alt="Hands-on hacking at CCG" className="w-full h-full object-cover" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* What is CCG Section */}
|
|
<section className="py-24 px-4 bg-muted/30">
|
|
<div className="container mx-auto max-w-6xl">
|
|
<div className="grid md:grid-cols-2 gap-12 items-center">
|
|
<div>
|
|
<h2 className="text-3xl md:text-4xl font-bold mb-6 text-balance">The Best Event in the World</h2>
|
|
<p className="text-muted-foreground leading-relaxed mb-4">
|
|
Join us for an unconference-style gathering where you bring as much as you receive. Friendships are made
|
|
that last a lifetime, and solidarity is built that might just coalesce into new digital public
|
|
infrastructures.
|
|
</p>
|
|
<p className="text-muted-foreground leading-relaxed mb-4">
|
|
CCG has spawned movements like <span className="text-primary font-semibold">#CoFi</span> and{" "}
|
|
<span className="text-primary font-semibold">#MycoFi</span>, and holds the possibility for a new
|
|
technologically-enabled commons that leverages network technologies to regain ground against state and
|
|
corporate control.
|
|
</p>
|
|
<p className="text-muted-foreground leading-relaxed">
|
|
What began in 2020 as a modest gathering has evolved into an annual moment of (re)connection and
|
|
reflection for a growing community of crypto-commons thinkers from around the world.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-2 gap-4">
|
|
<Card className="border-primary/20">
|
|
<CardContent className="p-6">
|
|
<Heart className="w-8 h-8 text-primary mb-3" />
|
|
<h3 className="font-semibold mb-2">Lifelong Friendships</h3>
|
|
<p className="text-sm text-muted-foreground">
|
|
Connect with like-minded individuals in a convivial setting
|
|
</p>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card className="border-primary/20">
|
|
<CardContent className="p-6">
|
|
<Sprout className="w-8 h-8 text-primary mb-3" />
|
|
<h3 className="font-semibold mb-2">Cross-Pollination</h3>
|
|
<p className="text-sm text-muted-foreground">Share visions, trajectories, and strategies</p>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card className="border-primary/20">
|
|
<CardContent className="p-6">
|
|
<Network className="w-8 h-8 text-primary mb-3" />
|
|
<h3 className="font-semibold mb-2">New Infrastructures</h3>
|
|
<p className="text-sm text-muted-foreground">Build regenerative and cooperative systems</p>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card className="border-primary/20">
|
|
<CardContent className="p-6">
|
|
<Users className="w-8 h-8 text-primary mb-3" />
|
|
<h3 className="font-semibold mb-2">Participant-Driven</h3>
|
|
<p className="text-sm text-muted-foreground">Everyone contributes and shapes the event</p>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Themes Section */}
|
|
<section className="py-24 px-4">
|
|
<div className="container mx-auto max-w-5xl">
|
|
<h2 className="text-3xl md:text-4xl font-bold mb-4 text-center text-balance">Explore Key Themes</h2>
|
|
<p className="text-muted-foreground text-center mb-12 max-w-2xl mx-auto">
|
|
Through participant-led sessions, we collectively explore the intersection of commoning, degrowth, and web3
|
|
</p>
|
|
|
|
<div className="grid sm:grid-cols-2 lg:grid-cols-3 gap-4">
|
|
{[
|
|
"Regenerative Finance",
|
|
"MycoFi",
|
|
"Community Currencies",
|
|
"Digital Commons",
|
|
"Crypto Commons",
|
|
"Open Source",
|
|
"Degrowth",
|
|
"Post-Capitalism",
|
|
"Ecofeminism",
|
|
"Multispecies Justice",
|
|
"Radical Game Design",
|
|
"Speculative Fiction",
|
|
].map((theme) => (
|
|
<div
|
|
key={theme}
|
|
className="p-4 bg-card border border-border rounded-lg hover:border-primary/40 transition-colors"
|
|
>
|
|
<p className="font-medium text-card-foreground">{theme}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Unconference Format */}
|
|
<section className="py-24 px-4 relative overflow-hidden">
|
|
<div
|
|
className="absolute inset-0 bg-cover bg-center"
|
|
style={{
|
|
backgroundImage: `url('/images/image.jpeg')`,
|
|
}}
|
|
/>
|
|
<div className="absolute inset-0 bg-primary/90" />
|
|
<div className="container mx-auto max-w-4xl text-center relative z-10">
|
|
<h2 className="text-3xl md:text-4xl font-bold mb-6 text-balance text-primary-foreground">
|
|
What is an Unconference?
|
|
</h2>
|
|
<p className="text-lg leading-relaxed opacity-90 mb-8 text-primary-foreground">
|
|
An unconference is a participant-driven event format that emphasizes open, flexible, and spontaneous
|
|
discussions rather than traditional pre-planned presentations. Unlike conventional conferences,
|
|
unconferences have no predefined agenda or speakers.
|
|
</p>
|
|
<p className="leading-relaxed opacity-90 mb-8 text-primary-foreground">
|
|
Attendees collaboratively propose topics, sessions, and activities on the spot. Participants vote or
|
|
self-organize around topics they find most interesting, forming small groups or breakout sessions where
|
|
discussions, workshops, or hands-on activities take place.
|
|
</p>
|
|
<p className="leading-relaxed opacity-90 text-primary-foreground">
|
|
Everyone is considered equally qualified to contribute, share insights, and guide conversations. Bring your
|
|
ideas for talks, roundtables, workshops, prototyping sessions, board game nights, LARPs, and more.
|
|
</p>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Location Section */}
|
|
<section className="py-24 px-4">
|
|
<div className="container mx-auto max-w-6xl">
|
|
<div className="grid md:grid-cols-2 gap-12 items-center">
|
|
<div className="order-2 md:order-1">
|
|
<div className="aspect-[4/3] bg-muted rounded-lg overflow-hidden">
|
|
<img
|
|
src="/austrian-alps-foothills-mountain-landscape-with-tr.jpg"
|
|
alt="Commons Hub in the Austrian Alps"
|
|
className="w-full h-full object-cover"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="order-1 md:order-2">
|
|
<h2 className="text-3xl md:text-4xl font-bold mb-6">The Commons Hub</h2>
|
|
<p className="text-muted-foreground leading-relaxed mb-4">
|
|
Located in the foothills of the Austrian Alps at Reichenau an der Rax, the Commons Hub provides a
|
|
convivial, off-grid setting perfect for deep reflection and meaningful connection.
|
|
</p>
|
|
<p className="text-muted-foreground leading-relaxed mb-6">
|
|
The Commons Hub has become a full-fledged event hosting organization, co-led by brothers Felix and Emil
|
|
Fritsch, with exciting expansion and ecovillage plans in the works.
|
|
</p>
|
|
|
|
<div className="space-y-3 mb-8">
|
|
<div className="flex items-start gap-3">
|
|
<MapPin className="w-5 h-5 text-primary mt-0.5 flex-shrink-0" />
|
|
<div>
|
|
<p className="font-medium">Richard von Schoeller-Straße 9</p>
|
|
<p className="text-sm text-muted-foreground">2651 Reichenau an der Rax, Austria</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="flex gap-4">
|
|
<Button variant="outline" asChild>
|
|
<Link href="https://ccg2025.vercel.app/directions" target="_blank" rel="noopener noreferrer">
|
|
Get Directions
|
|
</Link>
|
|
</Button>
|
|
<Button variant="outline" asChild>
|
|
<Link href="https://www.commons-hub.at/" target="_blank" rel="noopener noreferrer">
|
|
Visit Commons Hub
|
|
</Link>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* CTA Section */}
|
|
<section className="py-24 px-4 bg-muted/30">
|
|
<div className="container mx-auto max-w-3xl text-center">
|
|
<h2 className="text-3xl md:text-4xl font-bold mb-6 text-balance">Join the Sixth Edition of CCG</h2>
|
|
<p className="text-lg text-muted-foreground mb-8 text-pretty">
|
|
Whether you're reconnecting or arriving for the first time, CCG 2026 presents a space to collectively take
|
|
stock of what crypto commons has become and what it still could be.
|
|
</p>
|
|
|
|
<div className="flex flex-col sm:flex-row gap-4 justify-center mb-8">
|
|
<Button size="lg" className="gap-2" asChild>
|
|
<Link href="/register">
|
|
Register and Get Tickets <ArrowRight className="w-4 h-4" />
|
|
</Link>
|
|
</Button>
|
|
<Button size="lg" variant="outline" asChild>
|
|
<Link href="/transparency">Financial Transparency</Link>
|
|
</Button>
|
|
</div>
|
|
|
|
<p className="text-sm text-muted-foreground">
|
|
Interested in the Crypto Commons Association cooperative? Learn more at the event.
|
|
</p>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Footer */}
|
|
<footer className="py-12 px-4 border-t border-border">
|
|
<div className="container mx-auto max-w-6xl">
|
|
<div className="grid sm:grid-cols-2 md:grid-cols-4 gap-8 mb-8">
|
|
<div>
|
|
<h3 className="font-bold mb-4">CCG 2026</h3>
|
|
<p className="text-sm text-muted-foreground">
|
|
Crypto Commons Gathering
|
|
<br />
|
|
August 16-22, 2026
|
|
</p>
|
|
</div>
|
|
|
|
<div>
|
|
<h3 className="font-semibold mb-4 text-sm">Links</h3>
|
|
<ul className="space-y-2 text-sm">
|
|
<li>
|
|
<Link
|
|
href="https://ccg2025.vercel.app/about"
|
|
className="text-muted-foreground hover:text-foreground transition-colors"
|
|
>
|
|
About CCG 2026
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link
|
|
href="https://ccg2025.vercel.app/directions"
|
|
className="text-muted-foreground hover:text-foreground transition-colors"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
Directions
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/transparency" className="text-muted-foreground hover:text-foreground transition-colors">
|
|
Financial Transparency
|
|
</Link>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div>
|
|
<h3 className="font-semibold mb-4 text-sm">Community</h3>
|
|
<ul className="space-y-2 text-sm">
|
|
<li>
|
|
<Link
|
|
href="https://t.me/+8a7PooNV6202YjI0"
|
|
className="text-muted-foreground hover:text-foreground transition-colors"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
Telegram
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<span className="text-muted-foreground">#CoFi</span>
|
|
</li>
|
|
<li>
|
|
<span className="text-muted-foreground">#MycoFi</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div>
|
|
<h3 className="font-semibold mb-4 text-sm">Partners</h3>
|
|
<ul className="space-y-2 text-sm">
|
|
<li>
|
|
<Link
|
|
href="https://www.commons-hub.at/"
|
|
className="text-muted-foreground hover:text-foreground transition-colors"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
Commons Hub
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<span className="text-muted-foreground">Crypto Commons Association</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="pt-8 border-t border-border text-center text-sm text-muted-foreground">
|
|
<p>© 2026 Crypto Commons Gathering. Built with solidarity for the commons.</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
)
|
|
}
|