The source code for our eny.social landing page, which is mirrored in a different repository as part of the CI setup.
eny.social
social-network
eny
local-first
feat(pages): add offenbach base page
+110
+110
app/offenbach/page.tsx
+110
app/offenbach/page.tsx
···
1
+
"use client";
2
+
3
+
import Nav from "../components/Nav";
4
+
import Footer from "../components/Footer";
5
+
import FadeIn from "../components/ui/FadeIn";
6
+
import SectionIntroLabel from "../components/ui/SectionIntroLabel";
7
+
import ButtonCta from "../components/ui/ButtonCta";
8
+
9
+
export default function OffenbachPage() {
10
+
const features = [
11
+
{
12
+
title: "Find your neighbors",
13
+
description:
14
+
"Connect with people in your neighborhood. Share recommendations, organize meetups, or just say hello.",
15
+
color: "var(--tangerine-dream)",
16
+
},
17
+
{
18
+
title: "Local events",
19
+
description:
20
+
"Discover what's happening around you from street festivals to gallery openings to community cleanups.",
21
+
color: "var(--cotton-candy)",
22
+
},
23
+
{
24
+
title: "City services",
25
+
description:
26
+
"Trash collection schedules, public transport updates, official announcements: all in one feed.",
27
+
color: "var(--monte-carlo)",
28
+
},
29
+
{
30
+
title: "Find an apartment",
31
+
description:
32
+
"No more scrolling through five different platforms. Local housing listings from real people.",
33
+
color: "var(--apricot-dream)",
34
+
},
35
+
];
36
+
37
+
return (
38
+
<div className="overflow-x-hidden">
39
+
<Nav />
40
+
<main>
41
+
{/* Hero */}
42
+
<section className="relative px-6 pt-32 pb-24">
43
+
<div className="relative mx-auto max-w-4xl text-center">
44
+
<FadeIn>
45
+
<SectionIntroLabel>offenbach.social</SectionIntroLabel>
46
+
</FadeIn>
47
+
48
+
<FadeIn delay={100}>
49
+
<h2 className="mt-6">
50
+
Your city. Your community.{" "}
51
+
<span className="italic text-tangerine">One app.</span>
52
+
</h2>
53
+
</FadeIn>
54
+
55
+
<FadeIn delay={200}>
56
+
<p className="section-copy mx-auto mt-8 max-w-2xl">
57
+
Offenbach is where eny.social begins. A hyper-local social
58
+
network for the people who live here. Connecting neighbors,
59
+
surfacing local events, and making city life easier.
60
+
</p>
61
+
</FadeIn>
62
+
</div>
63
+
</section>
64
+
65
+
{/* Features */}
66
+
<section className="px-6 py-24">
67
+
<div className="mx-auto max-w-5xl">
68
+
<div className="grid gap-8 md:grid-cols-2">
69
+
{features.map((feature, i) => (
70
+
<FadeIn key={feature.title} delay={i * 100}>
71
+
<div
72
+
className="rounded-3xl p-8"
73
+
style={{ backgroundColor: feature.color }}
74
+
>
75
+
<h3 className="headline-label mb-4">{feature.title}</h3>
76
+
<p className="section-copy">{feature.description}</p>
77
+
</div>
78
+
</FadeIn>
79
+
))}
80
+
</div>
81
+
</div>
82
+
</section>
83
+
84
+
{/* CTA */}
85
+
<section className="px-6 py-24">
86
+
<div className="mx-auto max-w-2xl text-center">
87
+
<FadeIn>
88
+
<h2>
89
+
Be part of the{" "}
90
+
<span className="italic text-tangerine">first wave</span>
91
+
</h2>
92
+
</FadeIn>
93
+
<FadeIn delay={100}>
94
+
<p className="section-copy mx-auto mt-6 max-w-lg">
95
+
We're launching in Offenbach first. Join the waitlist and
96
+
help shape what a local social network can be.
97
+
</p>
98
+
</FadeIn>
99
+
<FadeIn delay={200}>
100
+
<ButtonCta href="/#waitlist" variant="ghost" className="mt-10">
101
+
join the waitlist
102
+
</ButtonCta>
103
+
</FadeIn>
104
+
</div>
105
+
</section>
106
+
</main>
107
+
<Footer />
108
+
</div>
109
+
);
110
+
}