Skip to content

Commit 0ee9437

Browse files
emilyokeefeMartinBraquet
emilyokeefe
and
MartinBraquet
authored
Changed wording (#4)
* Changed wording * remove share button because it doesn't function yet --------- Co-authored-by: Martin Braquet <[email protected]>
1 parent 6fe646a commit 0ee9437

File tree

1 file changed

+117
-49
lines changed

1 file changed

+117
-49
lines changed

‎app/About/page.tsx‎

Lines changed: 117 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -5,61 +5,129 @@ import {aColor} from "@/lib/client/constants";
55

66
export default function About() {
77

8-
// const [totalUsers, setTotalUsers] = useState<number>(0);
9-
// useEffect(() => {
10-
// const getCount = async () => {
11-
// const countResponse = await fetch('/api/profiles/count');
12-
// if (countResponse.ok) {
13-
// const {count} = await countResponse.json();
14-
// setTotalUsers(count);
15-
// }
16-
// };
17-
//
18-
// getCount();
19-
// }, []); // <- runs once after initial mount
208
return (
219
<div className="text-gray-600 dark:text-white min-h-screen p-6">
2210
{aColor}
23-
<div className="max-w-3xl mx-auto">
24-
<h1 className="text-3xl font-bold mb-4 text-center">About Compass</h1>
11+
<div className="w-full">
12+
<div className="w-screen relative left-1/2 right-1/2 -ml-[50vw] -mr-[50vw] bg-gray-100 dark:bg-gray-800 py-8 mb-8 overflow-hidden">
13+
<div className="relative z-10 max-w-3xl mx-auto px-4">
14+
<h1 className="text-3xl font-bold mb-4 text-center">Why Choose Compass?</h1>
15+
<div className="flex flex-col md:flex-row items-center justify-center mb-8 gap-8">
16+
<div className="w-40 h-40 bg-gray-200 rounded-xl flex items-center justify-center overflow-hidden">
17+
<img src="/favicon.ico" alt="Compass logo" className="w-full h-full object-cover" />
18+
</div>
19+
<div className="w-full max-w-2xl mx-auto text-center md:text-left">
20+
<h3 className="text-2xl font-bold mb-2">Built for users, by users.</h3>
21+
<p className="text-gray-600 dark:text-gray-300 text-lg">Open, transparent, and truly user-first. No paywalls, no addictive algorithms, no venture capital. Just real people, real values, and real connections.</p>
22+
</div>
23+
</div>
24+
<div className="flex justify-center mb-8">
25+
<Link
26+
href="/register"
27+
className="px-8 py-3 text-white text-lg rounded-full font-bold shadow transition bg-gradient-to-r from-red-700 to-red-900 hover:from-red-800 hover:to-red-950"
28+
>
29+
Join Now
30+
</Link>
31+
</div>
32+
</div>
33+
</div>
2534
<div className="et_pb_text_inner">
26-
{/*<h1 id="abstract">Abstract</h1>*/}
27-
<p>Forming and maintaining close connections is fundamental for most people’s mental health—and hence overall
28-
well-being. However, currently available meeting platforms, lacking transparency and searchability, are
29-
deeply failing to bring together thoughtful people. This platform is designed to
30-
foster close friendships and relationships for people who prioritize learning, curiosity, and critical
31-
thinking. The directory of users is fully transparent and each profile contains extensive
32-
information, allowing searches over all users through powerful filtering and sorting methods. To prevent any
33-
value drift from this pro-social mission, the platform will always be free, ad-free, not for profit,
34-
donation-supported, open source, and democratically governed.</p>
35-
<div className="mt-8 flex space-x-4 justify-center">
36-
<Link
37-
href="/manifesto"
38-
className="px-6 py-3 bg-gray-200 dark:bg-gray-600 text-gray-800 dark:text-white text-lg rounded-full hover:bg-gray-300 dark:hover:bg-gray-500 transition"
39-
>
40-
The Deeper Why
41-
</Link>
35+
<div className="max-w-3xl mx-auto mt-8 mb-8">
36+
<section className="mb-12">
37+
<h2 className="text-3xl font-bold mb-4">Search EXACTLY What You're Looking For</h2>
38+
<p className="text-lg text-gray-500">Keyword search from our entire database. Meet your introverted rock climbing dream bae who's also into Magic the Gathering and cats. ME-OW!</p>
39+
</section>
40+
<section className="mb-12">
41+
<h2 className="text-3xl font-bold mb-4">Get Notified About Your Searches</h2>
42+
<p className="text-lg text-gray-500">When someone joins and meets your search criteria, get notified!</p>
43+
<p className="text-lg text-gray-500">Goodbye swipe addiction. Hello precious time!</p>
44+
</section>
45+
<section className="mb-12">
46+
<h2 className="text-3xl font-bold mb-4">Everything is free. Seriously.</h2>
47+
<p className="text-lg text-gray-500">No subscriptions. No paywalls. We're designed by regular people who were fed up by inaccessible and extractive dating apps.</p>
48+
</section>
49+
<section className="mb-12">
50+
<h2 className="text-3xl font-bold mb-4">Character is Hot</h2>
51+
<p className="text-lg text-gray-500">Personality first, pictures last. Instead of swiping on people based on how hot that six pack looks, let's focus on how he saved that cat from a tree.</p>
52+
</section>
53+
<section className="mb-12">
54+
<h2 className="text-3xl font-bold mb-4">Fully Transparent</h2>
55+
<p className="text-lg text-gray-500">You're in the know. Our code is open source, there are clear policies, absolutely no data-selling, and we are community designed.</p>
56+
</section>
57+
</div>
58+
</div>
59+
<div className="w-screen relative left-1/2 right-1/2 -ml-[50vw] -mr-[50vw] bg-gray-100 dark:bg-gray-800 py-8 mt-12 overflow-hidden">
60+
<div className="relative z-10 max-w-3xl mx-auto px-4">
61+
<h3 className="text-4xl font-bold text-center mt-8 mb-8">Help Improve Compass</h3>
62+
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 mb-8">
63+
<div className="bg-white dark:bg-gray-900 rounded-xl shadow p-6 flex flex-col items-center">
64+
<h5 id="give-suggestions-or-contribute" className="font-bold mb-4 text-xl text-center">Give Suggestions or Contribute</h5>
65+
<p className="mb-4 text-center">Give suggestions or let us know you want to help through this form!</p>
66+
<a
67+
href="https://forms.gle/tKnXUMAbEreMK6FC6"
68+
className="px-6 py-2 rounded-full bg-gray-200 text-gray-800 font-semibold text-lg shadow hover:bg-gray-300 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600 transition"
69+
target="_blank" rel="noopener noreferrer"
70+
>
71+
Suggest Here
72+
</a>
73+
</div>
74+
<div className="bg-white dark:bg-gray-900 rounded-xl shadow p-6 flex flex-col items-center">
75+
<h5 id="join-chats" className="font-bold mb-4 text-xl text-center">Join Chats</h5>
76+
<p className="mb-4 text-center">Join the community to shape the product—or just chat with like-minded people.</p>
77+
<a
78+
href="https://discord.gg/8Vd7jzqjun"
79+
className="px-6 py-2 rounded-full bg-gray-200 text-gray-800 font-semibold text-lg shadow hover:bg-gray-300 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600 transition"
80+
target="_blank" rel="noopener noreferrer"
81+
>
82+
Join the Discord
83+
</a>
84+
</div>
85+
<div className="bg-white dark:bg-gray-900 rounded-xl shadow p-6 flex flex-col items-center">
86+
<h5 id="share" className="font-bold mb-4 text-xl text-center">Tell Your Friends and Family</h5>
87+
<p className="mb-4 text-center">We're a new app, and the more people who use it, the more useful it is!</p>
88+
</div>
89+
<div className="bg-white dark:bg-gray-900 rounded-xl shadow p-6 flex flex-col items-center">
90+
<h5 id="donate" className="font-bold mb-4 text-xl text-center">Donate</h5>
91+
<p className="mb-4 text-center">We're not-for-profit with no paywalls for the best user experience. Support the infrastructure. (GitHub has increased transparency, but requires an account).</p>
92+
<div className="flex flex-col gap-4 w-full items-center">
93+
<a
94+
href="https://www.paypal.com/paypalme/MartinBraquet"
95+
className="px-6 py-2 rounded-full bg-gray-200 text-gray-800 font-semibold text-lg shadow hover:bg-gray-300 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600 transition w-full text-center"
96+
target="_blank" rel="noopener noreferrer"
97+
>
98+
Donate on PayPal
99+
</a>
100+
<a
101+
href="https://github.com/sponsors/MartinBraquet"
102+
className="px-6 py-2 rounded-full bg-gray-200 text-gray-800 font-semibold text-lg shadow hover:bg-gray-300 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600 transition w-full text-center"
103+
target="_blank" rel="noopener noreferrer"
104+
>
105+
Donate on GitHub
106+
</a>
107+
</div>
108+
</div>
109+
<div className="bg-white dark:bg-gray-900 rounded-xl shadow p-6 flex flex-col items-center md:col-span-2">
110+
<h5 id="github-repo" className="font-bold mb-4 text-xl text-center">Help Develop the App</h5>
111+
<p className="mb-4 text-center">The source code and instructions for development are available on GitHub.</p>
112+
<a
113+
href="https://github.com/BayesBond/BayesBond"
114+
className="px-6 py-2 rounded-full bg-gray-200 text-gray-800 font-semibold text-lg shadow hover:bg-gray-300 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600 transition"
115+
target="_blank" rel="noopener noreferrer"
116+
>
117+
View Code
118+
</a>
119+
</div>
120+
</div>
121+
<div className="flex justify-center mt-12 mb-16">
122+
<Link
123+
href="/register"
124+
className="px-8 py-3 text-white text-lg rounded-full font-bold shadow transition bg-gradient-to-r from-red-700 to-red-900 hover:from-red-800 hover:to-red-950"
125+
>
126+
Join Compass
127+
</Link>
128+
</div>
42129
</div>
43-
<h3 id="how-to-help">How to Help</h3>
44-
<h5 id="give-suggestions-or-contribute">Give Suggestions or Contribute</h5>
45-
<p>Give suggestions or let us know you want to help through this <a
46-
href="https://forms.gle/tKnXUMAbEreMK6FC6">form</a>!</p>
47-
<h5 id="join-chats">Join Chats</h5>
48-
<p>Join the community on <a
49-
href="https://discord.gg/8Vd7jzqjun">Discord</a> to shape and test the product—or just chat with
50-
like-minded people.</p>
51-
<h5 id="share">Share</h5>
52-
<p>Share the app and article with people who may benefit from the product.</p>
53-
<h5 id="donate">Donate</h5>
54-
<p>Donate to support the initial infrastructure via <a
55-
href="https://www.paypal.com/paypalme/MartinBraquet">PayPal</a> or <a
56-
href="https://github.com/sponsors/MartinBraquet">GitHub</a> (GitHub has increased transparency, but requires
57-
an account).</p>
58-
<h5 id="github-repo">Source Code</h5>
59-
<p>The source code and instructions for development are available on <a href="https://github.com/BayesBond/BayesBond">GitHub</a>.</p>
60130
</div>
61-
{/*<h3 id="how-to-help">Statistics</h3>*/}
62-
{/*<p>{totalUsers} total users</p>*/}
63131
</div>
64132
</div>
65133
);

0 commit comments

Comments
 (0)