102 lines
4.6 KiB
TypeScript
102 lines
4.6 KiB
TypeScript
const ventures = [
|
||
{
|
||
name: 'ThreeFold',
|
||
logo: '/images/ventures/tf.png',
|
||
description: 'ThreeFold is a scalable bare metal infrastructure layer for AI, Internet, and Cloud – presenting a cloud solution that offers unmatched security, reliability, performance, and autonomy. Leveraging open source technology as developed by TF9.',
|
||
url: 'https://threefold.io',
|
||
learnMoreUrl: './threefold'
|
||
},
|
||
{
|
||
name: 'GeoMind',
|
||
logo: '/images/ventures/geo_ico.png',
|
||
description: 'GeoMind is a software company which has developed a cloud computing system designed for global scalability, offering secure, immutable data storage that ensures integrity and permanence.',
|
||
url: 'https://geomind.io',
|
||
learnMoreUrl: './geomind'
|
||
},
|
||
{
|
||
name: 'Zanzibar Digital Free Zone',
|
||
logo: '/images/ventures/freezone.png',
|
||
description: 'A collaboration with the Government of Zanzibar through ZICTA. 100% digital and automated, offering seamless legal, financial, and operational support for businesses. The FreeZone provides regulatory incentives and benefits to businesses through a fully online platform.',
|
||
url: 'http://cybercity.ourworld.tf/',
|
||
learnMoreUrl: './freezone'
|
||
},
|
||
{
|
||
name: 'Zanzibar Cyber City',
|
||
logo: '/images/ventures/cybercity.png',
|
||
description: 'A visionary startup city featuring 3,000 units in its initial stages. The cyber city aims to be a collaborative hub for innovation, bringing together startups, investors, and technologists in a state-of-the-art urban environment.',
|
||
url: 'http://cybercity.ourworld.tf/',
|
||
learnMoreUrl: './cybercity'
|
||
},
|
||
{
|
||
name: 'Indaba',
|
||
logo: '/images/ventures/ow_icon.png',
|
||
description: 'Indaba is a social business empowering young people to be resilient, reach their full potential, and contribute to the common good. A global ecosystem for holistic learning - accessible online and offline, affordable to the many, and grounded in culture, care, and collaboration.',
|
||
url: 'https://sikana.tv',
|
||
learnMoreUrl: './indaba'
|
||
},
|
||
{
|
||
name: 'Hero',
|
||
logo: '/images/ventures/hero.png',
|
||
description: 'Hero is a digital assistant designed to give individuals full control over their digital identity and assets. Focused on privacy and autonomy, Hero helps manage personal information, tasks, and interactions across decentralized platforms.',
|
||
url: '#',
|
||
learnMoreUrl: './hero'
|
||
}
|
||
]
|
||
|
||
const heroContent = {
|
||
title: 'OurWorld Ventures',
|
||
subtitle: 'These are the first OurWorld Ventures, connected by a strong set of values and the aim to bring forward a new era of digital autonomy and empowerment.',
|
||
backgroundImage: '/images/ventures/earth.jpg',
|
||
backgroundAlt: 'Earth from space'
|
||
}
|
||
|
||
export function VenturesHero() {
|
||
return (
|
||
<div className="bg-white">
|
||
<div className="relative">
|
||
<img
|
||
src={heroContent.backgroundImage}
|
||
alt={heroContent.backgroundAlt}
|
||
className="h-96 w-full object-cover object-center"
|
||
/>
|
||
<div className="absolute inset-0 bg-gradient-to-t from-white"></div>
|
||
</div>
|
||
|
||
<div className="relative mx-auto -mt-28 max-w-7xl px-4 pb-24 sm:px-6 sm:pb-24 lg:px-8">
|
||
<div className="mx-auto max-w-2xl text-center lg:max-w-4xl">
|
||
<h1 className="h1-default text-gray-900">{heroContent.title}</h1>
|
||
<p className="mt-4 p-default text-gray-800">{heroContent.subtitle}</p>
|
||
</div>
|
||
|
||
<dl className="mx-auto mt-16 grid max-w-2xl grid-cols-1 gap-x-8 gap-y-16 sm:grid-cols-2 lg:max-w-none lg:grid-cols-3 lg:gap-x-12 lg:gap-y-10">
|
||
{ventures.map((venture, index) => (
|
||
<div key={index} className="border-t border-gray-200 pt-4">
|
||
<div className="flex items-center">
|
||
<a href={venture.url} target="_blank" rel="noopener" className="flex items-center hover:text-indigo-700">
|
||
<img
|
||
src={venture.logo}
|
||
alt={`${venture.name} Logo`}
|
||
className="w-8 h-8 mr-2"
|
||
/>
|
||
<dt className="font-semibold text-xl text-gray-900 lg:text-2xl">{venture.name}</dt>
|
||
</a>
|
||
</div>
|
||
<dd className="mt-2 font-light tracking-normal text-gray-600">
|
||
{venture.description}
|
||
</dd>
|
||
<div className="mt-4">
|
||
<a
|
||
href={venture.learnMoreUrl}
|
||
className="text-sm font-medium text-black hover:text-gray-700"
|
||
>
|
||
Learn more <span aria-hidden="true">→</span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
))}
|
||
</dl>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|