This commit is contained in:
sasha-astiadi 2025-07-28 13:18:54 +02:00
parent f6d193a88c
commit 49a385d366
7 changed files with 224 additions and 28 deletions

33
src/app/contact/page.tsx Normal file
View File

@ -0,0 +1,33 @@
import { CallToAction } from '@/components/CallToAction'
import { Faqs } from '@/components/Faqs'
import { Footer } from '@/components/Footer'
import { Header_darkbg } from '@/components/Header_darkbg'
import { HomeAbout } from '@/components/HomeAbout'
import { Hero } from '@/components/Hero'
import { Pricing } from '@/components/Pricing'
import { PrimaryFeatures } from '@/components/PrimaryFeatures'
import { SecondaryFeatures } from '@/components/SecondaryFeatures'
import { Testimonials } from '@/components/Testimonials'
import { HomePrinciples } from '@/components/HomePrinciples'
import { HomeMilestones } from '@/components/HomeMilestones'
import { HomeVentures } from '@/components/HomeVentures'
import { Quote } from '@/components/Quote'
import { AboutHero } from '@/components/AboutHero'
import { AboutMission } from '@/components/AboutMission'
import { AboutExperience } from '@/components/AboutExperience'
import { ContactHero } from '@/components/ContactHero'
export default function Contact() {
return (
<>
<Header_darkbg />
<main>
<ContactHero />
<Quote />
<CallToAction />
<Faqs />
</main>
<Footer />
</>
)
}

View File

@ -0,0 +1,164 @@
import { BuildingOffice2Icon, EnvelopeIcon, PhoneIcon } from '@heroicons/react/24/outline'
export function ContactHero() {
return (
<div className="relative isolate bg-white">
<div className="mx-auto grid max-w-7xl grid-cols-1 lg:grid-cols-2">
<div className="relative px-6 pt-24 pb-20 lg:static lg:px-8 lg:py-32">
<div className="mx-auto max-w-xl lg:mx-0 lg:max-w-lg">
<div className="absolute inset-y-0 left-0 -z-10 w-full overflow-hidden bg-gray-100 ring-1 ring-gray-900/10 lg:w-1/2">
<svg
aria-hidden="true"
className="absolute inset-0 size-full mask-[radial-gradient(100%_100%_at_top_right,white,transparent)] stroke-gray-200"
>
<defs>
<pattern
x="100%"
y={-1}
id="83fd4e5a-9d52-42fc-97b6-718e5d7ee527"
width={200}
height={200}
patternUnits="userSpaceOnUse"
>
<path d="M130 200V.5M.5 .5H200" fill="none" />
</pattern>
</defs>
<rect width="100%" height="100%" strokeWidth={0} className="fill-white" />
<svg x="100%" y={-1} className="overflow-visible fill-gray-50">
<path d="M-470.5 0h201v201h-201Z" strokeWidth={0} />
</svg>
<rect fill="url(#83fd4e5a-9d52-42fc-97b6-718e5d7ee527)" width="100%" height="100%" strokeWidth={0} />
</svg>
<div
aria-hidden="true"
className="absolute top-[calc(100%-13rem)] -left-56 hidden transform-gpu blur-3xl lg:top-[calc(50%-7rem)] lg:left-[max(-14rem,calc(100%-59rem))]"
>
<div
style={{
clipPath:
'polygon(74.1% 56.1%, 100% 38.6%, 97.5% 73.3%, 85.5% 100%, 80.7% 98.2%, 72.5% 67.7%, 60.2% 37.8%, 52.4% 32.2%, 47.5% 41.9%, 45.2% 65.8%, 27.5% 23.5%, 0.1% 35.4%, 17.9% 0.1%, 27.6% 23.5%, 76.1% 2.6%, 74.1% 56.1%)',
}}
className="aspect-1155/678 w-288.75 bg-linear-to-br from-[#80caff] to-[#4f46e5] opacity-10"
/>
</div>
</div>
<h2 className="text-4xl font-semibold tracking-tight text-pretty text-gray-900 sm:text-5xl">
Get in Touch
</h2>
<p className="mt-6 text-lg/8 text-gray-600">
At OurWorld, we value your feedback and inquiries. Whether you're interested in our ventures, have questions about our technologies, or want to collaborate, we're here to connect. Reach out to us today and let's build a better digital future together.
</p>
<dl className="mt-10 space-y-4 text-base/7 text-gray-600">
<div className="flex gap-x-4">
<dt className="flex-none">
<span className="sr-only">Address</span>
<BuildingOffice2Icon aria-hidden="true" className="h-7 w-6 text-gray-400" />
</dt>
<dd>
Nexus Global Financial Services Limited,
<br />
Ebene, Mauritius.
</dd>
</div>
<div className="flex gap-x-4">
<dt className="flex-none">
<span className="sr-only">Email</span>
<EnvelopeIcon aria-hidden="true" className="h-7 w-6 text-gray-400" />
</dt>
<dd>
<a href="mailto:hello@example.com" className="hover:text-gray-900">
info@ourworld.tf
</a>
</dd>
</div>
</dl>
</div>
</div>
<form action="#" method="POST" className="px-6 pt-20 pb-24 sm:pb-32 lg:px-8 lg:py-48">
<div className="mx-auto max-w-xl lg:mr-0 lg:max-w-lg">
<div className="grid grid-cols-1 gap-x-8 gap-y-6 sm:grid-cols-2">
<div>
<label htmlFor="first-name" className="block text-sm/6 font-semibold text-gray-900">
First name
</label>
<div className="mt-2.5">
<input
id="first-name"
name="first-name"
type="text"
autoComplete="given-name"
className="block w-full rounded-md bg-white px-3.5 py-2 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-600"
/>
</div>
</div>
<div>
<label htmlFor="last-name" className="block text-sm/6 font-semibold text-gray-900">
Last name
</label>
<div className="mt-2.5">
<input
id="last-name"
name="last-name"
type="text"
autoComplete="family-name"
className="block w-full rounded-md bg-white px-3.5 py-2 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-600"
/>
</div>
</div>
<div className="sm:col-span-2">
<label htmlFor="email" className="block text-sm/6 font-semibold text-gray-900">
Email
</label>
<div className="mt-2.5">
<input
id="email"
name="email"
type="email"
autoComplete="email"
className="block w-full rounded-md bg-white px-3.5 py-2 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-600"
/>
</div>
</div>
<div className="sm:col-span-2">
<label htmlFor="phone-number" className="block text-sm/6 font-semibold text-gray-900">
Phone number
</label>
<div className="mt-2.5">
<input
id="phone-number"
name="phone-number"
type="tel"
autoComplete="tel"
className="block w-full rounded-md bg-white px-3.5 py-2 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-600"
/>
</div>
</div>
<div className="sm:col-span-2">
<label htmlFor="message" className="block text-sm/6 font-semibold text-gray-900">
Message
</label>
<div className="mt-2.5">
<textarea
id="message"
name="message"
rows={4}
className="block w-full rounded-md bg-white px-3.5 py-2 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-indigo-600"
defaultValue={''}
/>
</div>
</div>
</div>
<div className="mt-8 flex justify-end">
<button
type="submit"
className="rounded-md bg-indigo-600 px-3.5 py-2.5 text-center text-sm font-semibold text-white shadow-xs hover:bg-indigo-500 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
>
Send message
</button>
</div>
</div>
</form>
</div>
</div>
)
}

View File

@ -6,57 +6,59 @@ import backgroundImage from '@/images/background-faqs.jpg'
const faqs = [
[
{
question: 'Does OurWorld handle VAT?',
question: 'What is OurWorld?',
answer:
'Well no, but if you move your company offshore you can probably ignore it.',
'OurWorld is a venture creator focused on building decentralized digital infrastructure for a more sovereign, inclusive, and regenerative future.',
},
{
question: 'Can I pay for my subscription via purchase order?',
answer: 'Absolutely, we are happy to take your money in all forms.',
question: 'Who is OurWorld for?',
answer:
'We collaborate with entrepreneurs, investors, governments, and changemakers who want to build systems beyond Big Tech and traditional finance.',
},
{
question: 'How do I apply for a job at OurWorld?',
question: 'How does OurWorld support ventures?',
answer:
'We only hire our customers, so subscribe for a minimum of 6 months and then lets talk.',
'We co-create projects by providing capital, strategy, governance, technical infrastructure, and access to a global network of collaborators.',
},
],
[
{
question: 'What was that testimonial about tax fraud all about?',
question: 'What kinds of projects are in the OurWorld ecosystem?',
answer:
'OurWorld is just a software application, ultimately your books are your responsibility.',
'Our portfolio includes decentralized cloud (ThreeFold), tokenized economies (TF9), digital jurisdictions (FreeZone), and open education (Sikana).',
},
{
question:
'OurWorld sounds horrible but why do I still feel compelled to purchase?',
question: 'Where does OurWorld operate?',
answer:
'This is the power of excellent visual design. You just cant resist it, no matter how poorly it actually functions.',
'Were active in strategic hubs like Mauritius, Zanzibar, UAE, Belgium, and expanding across Europe, Africa, and the Middle East.',
},
{
question:
'I found other companies called OurWorld, are you sure you can use this name?',
question: 'Is this a blockchain company?',
answer:
'Honestly not sure at all. We havent actually incorporated or anything, we just thought it sounded cool and made this website.',
'We use blockchain when its useful, but OurWorld is much broader—its about real-world infrastructure and long-term systemic change.',
},
],
[
{
question: 'How do you generate reports?',
question: 'How can I get involved with OurWorld?',
answer:
'You just tell us what data you need a report for, and we get our kids to create beautiful charts for you using only the finest crayons.',
'Whether youre a founder, funder, builder or policymaker—if you resonate with our mission, reach out to start a conversation.',
},
{
question: 'Can we expect more inventory features?',
answer: 'In life its really better to never expect anything at all.',
question: 'What is the Digital Freezone?',
answer:
'Its a sovereign digital jurisdiction enabling remote company creation, tokenized commerce, and flexible digital residency.',
},
{
question: 'I lost my password, how do I get into my account?',
question: 'Where can I learn more or contact the team?',
answer:
'Send us an email and we will send you a copy of our latest password spreadsheet so you can find your information.',
'Visit www.ourworld.tf or email us at info@ourworld.tf to explore opportunities and collaborations. Visit www.ourworld.tf/ventures to see our current initiatives.',
},
],
]
export function Faqs() {
return (
<section

View File

@ -74,7 +74,6 @@ function MobileNavigation() {
>
<MobileNavLink href="/about">About</MobileNavLink>
<MobileNavLink href="/ventures">Ventures</MobileNavLink>
<MobileNavLink href="/News">News</MobileNavLink>
<hr className="m-2 border-slate-300/40" />
<MobileNavLink href="/contact">Contact Us</MobileNavLink>
</PopoverPanel>
@ -95,7 +94,6 @@ export function Header() {
<NavLink href="/about">About</NavLink>
<NavLink href="/ventures">Ventures</NavLink>
<NavLink href="/people">People</NavLink>
<NavLink href="/news">News</NavLink>
</div>
</div>
<div className="flex items-center gap-x-5 md:gap-x-8">

View File

@ -89,7 +89,6 @@ function MobileNavigation() {
>
<MobileNavLink href="/about">About</MobileNavLink>
<MobileNavLink href="/ventures">Ventures</MobileNavLink>
<MobileNavLink href="/News">News</MobileNavLink>
<hr className="m-2 border-white/20" />
<MobileNavLink href="/contact">Contact Us</MobileNavLink>
</PopoverPanel>
@ -117,7 +116,7 @@ export function Header_darkbg() {
<NavLinkDark href="/about">About</NavLinkDark>
<NavLinkDark href="/ventures">Ventures</NavLinkDark>
<NavLinkDark href="/people">People</NavLinkDark>
<NavLinkDark href="/news">News</NavLinkDark>
</div>
</div>
<div className="flex items-center gap-x-5 md:gap-x-8">

View File

@ -45,9 +45,9 @@ export function PersonTemplate({ personData, biography }: PersonTemplateProps) {
<img
alt={personData.name}
src={personData.imageUrl}
width={1184}
height={1376}
className="aspect-12/7 w-full rounded-lg object-cover shadow-lg lg:aspect-auto"
width={592}
height={688}
className="aspect-12/7 w-1/2 mx-auto rounded-lg object-cover shadow-lg lg:aspect-auto"
/>
</figure>
</div>

View File

@ -1,6 +1,6 @@
export function Quote() {
return (
<section className="relative isolate overflow-hidden bg-white px-6 pt-12 pb-32 lg:px-8">
<section className="relative isolate overflow-hidden bg-white px-6 pt-24 pb-32 lg:px-8">
<div className="mx-auto max-w-2xl lg:max-w-4xl">
<img
alt=""